javascript - 整个滚动后的jQuery回调函数

Question

我将一些函数绑定到 jquery 的“滚动”事件。有了这个：

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

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

例如：http ://activatedrinks.com/

有人出主意吗？谢谢

问候，扬尼克

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

你需要去抖动回调到afterScroll

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

这是节流/去抖动功能的来源。非常好用的库。我通常将它包含在我的项目中。

Answer 3

如果我猜对了，只需在最后设置超时，如果滚动继续，请清除超时。

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