jQuery scroll()检测用户何时停止滚动
这样就可以了..
$(window).scroll(function()
{
$('.slides_layover').removeClass('showing_layover');
$('#slides_effect').show();
});根据我的理解，我可以分辨出有人在滚动。因此，我正在尝试找出当有人停下来的时候如何捕捉。从上面的示例中，您可以看到我正在从一组元素中删除一个类，同时滚动正在发生。但是，当用户停止滚动时，我想把这个类放回原处。
这样做的原因是，当页面滚动时，我打算有一个暂停式显示，以给页面一个特殊的效果，我正在尝试工作。但我试图在滚动时删除的一个类与这种效果冲突，因为它在某种程度上是透明的效果。
回答 12
Stack Overflow用户
发布于 2012-02-05 05:45:21
使用jQuery限制/去抖动
对于这样的问题，jQuery debounce是一个很好的解决方案。jsFidlle
$(window).scroll($.debounce( 250, true, function(){
$('#scrollMsg').html('SCROLLING!');
}));
$(window).scroll($.debounce( 250, function(){
$('#scrollMsg').html('DONE!');
}));第二个参数是"at_begin“标志。在这里，我展示了如何在“滚动开始”和“滚动结束”时执行代码。
使用Lodash
正如Barry P所建议的，jsFiddle、underscore或lodash也有一个去反跳，每个都有稍微不同的apis。
$(window).scroll(_.debounce(function(){
$('#scrollMsg').html('SCROLLING!');
}, 150, { 'leading': true, 'trailing': false }));
$(window).scroll(_.debounce(function(){
$('#scrollMsg').html('STOPPED!');
}, 150));Stack Overflow用户
发布于 2012-02-05 06:07:30
Rob W建议我在堆栈上查看另一篇文章，这篇文章本质上与我最初的文章类似。我读了一遍，发现了一个网站的链接：
http://james.padolsey.com/javascript/special-scroll-events-for-jquery/
这实际上帮助我很好地解决了我的问题，因为我自己的需求，但总的来说，帮助我摆脱了很多废话，并为我节省了大约4个小时的时间来自己解决。
看到这篇文章似乎有一些可取之处，我想我会回来提供最初在上面提到的链接上找到的代码，以防作者决定改变网站的方向，最终删除链接。
(function(){
var special = jQuery.event.special,
uid1 = 'D' + (+new Date()),
uid2 = 'D' + (+new Date() + 1);
special.scrollstart = {
setup: function() {
var timer,
handler = function(evt) {
var _self = this,
_args = arguments;
if (timer) {
clearTimeout(timer);
} else {
evt.type = 'scrollstart';
jQuery.event.handle.apply(_self, _args);
}
timer = setTimeout( function(){
timer = null;
}, special.scrollstop.latency);
};
jQuery(this).bind('scroll', handler).data(uid1, handler);
},
teardown: function(){
jQuery(this).unbind( 'scroll', jQuery(this).data(uid1) );
}
};
special.scrollstop = {
latency: 300,
setup: function() {
var timer,
handler = function(evt) {
var _self = this,
_args = arguments;
if (timer) {
clearTimeout(timer);
}
timer = setTimeout( function(){
timer = null;
evt.type = 'scrollstop';
jQuery.event.handle.apply(_self, _args);
}, special.scrollstop.latency);
};
jQuery(this).bind('scroll', handler).data(uid2, handler);
},
teardown: function() {
jQuery(this).unbind( 'scroll', jQuery(this).data(uid2) );
}
};
})();Stack Overflow用户
发布于 2014-03-12 00:27:48
我同意上面的一些评论，监听超时是不够准确的，因为当你停止移动滚动条足够长的时间而不是停止滚动时，就会触发超时。我认为一个更好的解决方案是在用户开始滚动时立即倾听用户松开鼠标(mouseup)的情况：
$(window).scroll(function(){
$('#scrollMsg').html('SCROLLING!');
var stopListener = $(window).mouseup(function(){ // listen to mouse up
$('#scrollMsg').html('STOPPED SCROLLING!');
stopListner(); // Stop listening to mouse up after heard for the first time
});
});在this JSFiddle中可以看到它工作的一个示例
https://stackoverflow.com/questions/9144560
复制相似问题
腾讯云开发者
