1. 程式人生 > >監聽滑鼠滾輪事件

監聽滑鼠滾輪事件

js:

//相容性寫法,該函式也是網上別人寫的,不過找不到出處了,蠻好的,所有我也沒有必要修改了
//判斷滑鼠滾輪滾動方向
if (window.addEventListener)//FF,火狐瀏覽器會識別該方法
    window.addEventListener('DOMMouseScroll', wheel, false);
window.onmousewheel = document.onmousewheel = wheel;//W3C
//統一處理滾輪滾動事件
function wheel(event){
    var delta = 0;
    if (!event) event = window.event;
    if (event.wheelDelta) {//IE、chrome瀏覽器使用的是wheelDelta,並且值為“正負120”
        delta = event.wheelDelta/120; 
        if (window.opera) delta = -delta;//因為IE、chrome等向下滾動是負值,FF是正值,為了處理一致性,在此取反處理
    } else if (event.detail) {//FF瀏覽器使用的是detail,其值為“正負3”
        delta = -event.detail/3;
    }
    if (delta)
        handle(delta);
}
//上下滾動時的具體處理函式
function handle(delta) {
        if (delta <0){//向下滾動
            
        }else{//向上滾動
            
        }
    }


jQ:
$(document).on('mousewheel DOMMouseScroll', onMouseScroll);
function onMouseScroll(e){
    e.preventDefault();
    var wheel = e.originalEvent.wheelDelta || -e.originalEvent.detail;
    var delta = Math.max(-1, Math.min(1, wheel) );
    if(delta<0){//向下滾動
        console.log('向下滾動');
    }else{//向上滾動
        console.log('向上滾動');
    }    
}