mousewheel滚轮事件

原生的滚轮事件：火狐与其他浏览器使用了不同的事件

/* 

 * 滚轮事件只有firefox比较特殊，使用DOMMouseScroll; 其他浏览器使用mousewheel;

 * 

*/

// firefox

document.body.addEventListener("DOMMouseScroll", function(event) {



    var direction= event.detail && (event.detail > 0 ? "mousedown" : "mouseup");

    console.log(direction);    

});



// chrome and ie

document.body.onmousewheel = function (event) {

    event = event || window.event;



    var direction = event.wheelDelta && (event.wheelDelta > 0 ? "mouseup" : "mousedown");

    console.log(direction);

};

 

使用jquery兼容后的事件

// jquery 兼容的滚轮事件

$(document).on("mousewheel DOMMouseScroll", function (e) {

    

    var delta = (e.originalEvent.wheelDelta && (e.originalEvent.wheelDelta > 0 ? 1 : -1)) ||  // chrome & ie

                (e.originalEvent.detail && (e.originalEvent.detail > 0 ? -1 : 1));              // firefox



    

    if (delta > 0) {

        // 向上滚

        console.log("wheelup");

    } else if (delta < 0) {

        // 向下滚

        console.log("wheeldown");

    }

});