獲取滾動方向而不滾動

如何在不滾動頁面的情況下檢測滾動方向（鼠標滾輪向上/向下）？我的頁面包裝的高度爲100％，所以沒有內容可以滾動，但我需要從滾輪滾動方向。獲取滾動方向而不滾動

由於谷歌地圖的做法相同（使用mousehweel進行縮放而沒有「滾動」頁面），我不知道如何實現這一點。

2014-01-06 Slevin

這裏有信息關於如何做你想做的事情：http://www.adomas.org/javascript-mouse-wheel/ – Martin

如果您正在談論鼠標滾輪，您可以在窗口上使用addEventListener。 event.wheelDelta將有-120或120增量，滾動向下和向上，分別爲：

window.addEventListener('mousewheel', function(e){ 
    wDelta = e.wheelDelta < 0 ? 'down' : 'up'; 
    console.log(wDelta); 
});

JSFiddle

當然，你需要配合不同的瀏覽器。但我會留給你的。請參見here

來源

2014-01-06 11:29:13 George

謝謝！工程就像一個魅力:) – Slevin

這很好知道。 – enguerranws

很高興爲我提供幫助（： – George

您可以將事件處理程序添加到mousewheel事件中，同時獲取的不僅是event對象，還包含車輪增量。

// Using jQuery library 
$(function() { 
    $('body').bind('mousewheel', function(event, delta) { 
     // delta > 0 scroll up 
     // delta < 0 scroll down 
    }); 
});

純JavaScript：

document.onmousewheel = function(evt){ 
    console.log(evt) // take a look in your console at evt.wheelDeltaX, evt.wheelDeltaY 
    //evt.wheelDeltaX is horizont scroll 
    //evt.wheelDeltaY is vertical scroll 
    //evt.wheelDelta is deltas x+y 

    // if evt.wheelDeltaY < 0 then scroll down, if >0 then scroll up 
    // if evt.wheelDeltaX < 0 then scroll left, if >0 then scroll right 
}

來源

2014-01-06 11:30:31 Epsil0neR

您可能想提及您使用jQuery，因爲OP沒有要求。 – George

退房的jQuery的MouseMove http://api.jquery.com/mousemove/ 店前面的XY爲變量，它與當前onces比較，以確定鼠標指針的方向

來源

2014-01-06 11:30:53 osmancode

獲取滾動方向而不滾動

回答

相關問題