如何确定jQuery滚动事件的方向？

Question

如何确定jQuery滚动事件的方向？

我在寻找这样的东西：

$(window).scroll(function(event){
   if (/* magic code*/ ){
       // upscroll code
   } else {
      // downscroll code
   }});

有什么想法吗？

Answer 1

检查电流scrollTop与以前scrollTopvar lastScrollTop = 0;$(window).scroll(function(event){    var st = $(this).scrollTop();    if (st > lastScrollTop){        // downscroll code    } else {       // upscroll code    }    lastScrollTop = st;});

Answer 2

您可以这样做，而不必跟踪上一个滚动顶部，正如所有其他示例所要求的那样：$(window).bind('mousewheel', function(event) {     if (event.originalEvent.wheelDelta >= 0) {         console.log('Scroll up');     }     else {         console.log('Scroll down');     }});我不是这方面的专家，所以可以继续研究，但是当你使用$(element).scroll，正在收听的事件是“滚动”事件。但如果你特别听一听mousewheel事件，通过使用绑定，originalEvent回调的事件参数的属性包含不同的信息。部分信息是wheelDelta..如果是阳性的话，你就把鼠标动起来。如果是阴性，你就把鼠标向下移动。我猜是mousewheel事件将在鼠标轮转动时触发，即使页面没有滚动；在这种情况下，“滚动”事件可能不会被触发。如果你愿意，你可以打电话event.preventDefault()在回调的底部，以防止页面滚动，以便您可以将鼠标轮事件用于页面滚动以外的其他内容，例如某种类型的缩放功能。

Answer 3

存储上一个滚动位置，然后查看新滚动位置是否大于或小于该位置。以下是避免任何全局变量的方法(这里有小提琴):(function () {     var previousScroll = 0;     $(window).scroll(function(){        var currentScroll = $(this).scrollTop();        if (currentScroll > previousScroll){            alert('down');        } else {           alert('up');        }        previousScroll = currentScroll;     });}()); //run this anonymous function immediately