检测滚动

Question

我可以使用JS或jQuery检测滚动移动吗？

我想隐藏一个div只有当用户滚动，当他停止滚动div显示。

我想：

window.onscroll(function() { 
 
    $('.footerGeral').hide(); 
 
});

但是它不工作。

Answer 1

您是差不多吧，但它是.scroll()：

$(window).scroll(function() { 
    $('.footerGeral').hide(); 
}); 

可以在纯JavaScript做到这一点，是这样的：

window.onscroll = function() { 
    document.querySelectorAll(".footerGeral")[0].style.display = 'none'; 
} 

注：这只有你有内容，这不仅仅是观点。带滚动条的页面。

Answer 2

首先：它只有在你实际上有溢出内容（带滚动条）时才有效。如果您只是滚动，您将无法获得该活动。

其次，本地语法是：

window.onscroll = function() { 
    // Your code 
}; 

jQuery的做法是：

$(window).scroll(function() { 
    // Your code 
}); 

Answer 3

您可能需要使用scroll事件，像这样：

window.addEventListener('scroll', function(evt) {}); 

现在您可以检测用户使用evt.deltaX和滚动的像素数，或用document.body.scrollTop和document.body.scrollLeft完全滚动了多少。

Answer 4

您可以轻松地将Ben Alman的JQuery scroll()与debounce()从jquery.ba-throttle-debounce.js组合起来。

$(window).scroll($.debounce(250, true, function(){ 
    $('.footerGeral').hide(); //scrolling or scrolling stopped for less than 250 ms 
})); 
$(window).scroll($.debounce(250, function(){ 
    $('.footerGeral').show(); //scrolling stopped for more than 250 ms 
}));