2012-03-31 211 views

回答

46

向上滚动jQuery中/下区别,你可以使用:

var mousewheelevt = (/Firefox/i.test(navigator.userAgent)) ? "DOMMouseScroll" : "mousewheel" //FF doesn't recognize mousewheel as of FF3.x 
$('#yourDiv').bind(mousewheelevt, function(e){ 

    var evt = window.event || e //equalize event object  
    evt = evt.originalEvent ? evt.originalEvent : evt; //convert to originalEvent if possible    
    var delta = evt.detail ? evt.detail*(-40) : evt.wheelDelta //check for detail first, because it is used by Opera and FF 

    if(delta > 0) { 
     //scroll up 
    } 
    else{ 
     //scroll down 
    } 
}); 

此方法也适用于有overflow:hidden的div。

我成功地在FireFox,IE和Chrome中测试了它。

+0

这工作得很好!一个简单的''''e.preventDefault()'''也不允许你的滚动到任何父元素(如页面),如果你只是想在一个部分的滚动上做一些事情,而不是实际滚动你的元素或其父母 – 2015-07-24 20:11:57

+0

任何想法,这对苹果触控板或魔术鼠标与溢出隐藏? http://stackoverflow.com/q/32512924/770127 – ryanve 2015-09-10 23:36:33

+1

这不应该再做了,浏览器嗅探一直不是很好的做法。现在还有另一个跨浏览器事件会更好用。 http://stackoverflow.com/a/33334461/3168107 – Shikkediel 2015-10-29 11:38:13