javascript - 如何在 Jquery 中以不同方式检测 "Mouse wheel scroll"和 "Window manual scroll"

Question

我正在做一个元素，当用户使用鼠标滚轮滚动和窗口滚动(通过滚动右侧的滚动条)时，我想做一些 Action
我想出了一个解决方案，但它以两种方式执行操作，即当用户通过鼠标滚轮滚动和通过使用窗口上的滚动条手动滚动时。
这是我检测鼠标滚轮和窗口滚动条的代码

$(window).scroll(function(event){
        var st = $(this).scrollTop();
            if (st > lastScrollTop){
                $( "#gear1" ).css( "-webkit-transform", "rotate(" + (r + 10) + "deg)" );
                r = r + 10;

            } else {

                $( "#gear1" ).css( "-webkit-transform", "rotate(" + (r - 10) + "deg)" );
                r = r - 10;
            }
          lastScroll = st;
});

当用户滚动鼠标滚轮 和用户滚动窗口滚动条 时，我想执行不同的操作。

我需要这样的东西:

If (scroll type is Mouse wheel ){
   // Do some action
}

If (scroll type is Window scroll (Scrolling by Scrollbar on right side of browser window) ){
   // Do some action
}

Answer 1

你可以使用这个 library检测鼠标滚轮的移动。以下是如何将它与 jQuery 一起使用(代码从文档中复制):

$('#my_elem').on('mousewheel', function(event) {
   //...
});

或者，您可以在不使用任何库的情况下使用以下代码:

$('body,html').bind('scroll mousedown wheel DOMMouseScroll mousewheel keyup', function(e){
 if ( e.which > 0 || e.type == "mousedown" || e.type == "mousewheel"){
    //...
 }
})

如果您使用第二个选项，则检测没有鼠标滚轮的滚动的代码将是:

$(window).scroll(function(e){
    //...
});