2012-03-31 30 views

Trả lời

46

Để phân biệt giữa cuộn lên/xuống trong jQuery, bạn có thể sử dụng:

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 
    } 
}); 

Phương pháp này cũng làm việc trong divs có overflow:hidden.

Tôi đã thử nghiệm thành công trong FireFox, IE và Chrome.

+0

Điều này hoạt động rất tốt! Một '' 'e.preventDefault()' '' đơn giản cũng sẽ không cho phép cuộn của bạn đi đến bất kỳ phần tử cha nào (như trang) nếu bạn chỉ muốn làm điều gì đó trên cuộn một phần và không thực sự cuộn yếu tố hoặc cha mẹ của nó –

+0

bất kỳ ý tưởng cho điều này trên trackpad táo hoặc chuột ma thuật với tràn ẩn? http://stackoverflow.com/q/32512924/770127 – ryanve

+1

Điều này không nên được thực hiện nữa, trình duyệt sniffing đã không được thực hành tuyệt vời cho một thời gian khá. Có một sự kiện trình duyệt chéo khác bây giờ sẽ tốt hơn để sử dụng. http://stackoverflow.com/a/33334461/3168107 – Shikkediel

Các vấn đề liên quan