Question

我将一些函数绑定到jquery的'scroll'事件。有了这个：

$window.bind('scroll', function(){ 
        fn1(...);
        afterScroll(); // function which should fired after whole scrolling.            
})

问题是，我希望在所有滚动迭代后触发“afterScroll（）”函数。但我认为当用户滚动一次时，事件 - 函数将被触发几次（我用一些警告对此进行了测试） afterScroll（）应该在滚动定义完成后添加一个简短的动画。

例如：http://activatedrinks.com/

有人有想法吗？感谢

映入眼帘，的Yannick

Answer 1

很难说用户何时完成滚动，并且没有此类事件。您必须确定用户何时“完成”自己滚动。有些用户可能会非常慢地滚动，但仍会将其视为单个滚动。像...这样的东西。

var scrolltime = false;
$window.scroll(function () {
   fn1(...);
   if (scrolltime) {
      clearTimeout(scrolltime);
   }
   //You consider 500 MS between scrolls to be "done" with scrolling.
   scrolltime = setTimeout(afterScroll, 500);
});

Answer 2

您需要debounce回调afterScroll

基本上去抖动会丢弃除最后一个之外的所有重复调用函数，你需要做的就是设置一个阈值来告诉它'重复'是什么

这是油门/去抖功能的source。非常好用的lib。我通常将它包含在我的项目中。

Answer 3

如果我说得对，只需在最后设置超时，如果滚动继续，则清除超时。

setTimeout(1000, function(){ afterScroll(); });

整个滚动后的jQuery回调函数

3 个答案: