用户停止滚动时的事件 [英] Event when user stops scrolling

问题描述

当用户滚动页面时，我想做一些花哨的jQuery东西。但我不知道如何解决这个问题，因为只有scroll（）方法。

I'd like to do some fancy jQuery stuff when the user scrolls the page. But I have no idea how to tackle this problem, since there is only the scroll() method.

任何想法？

推荐答案

您可以使 scroll（）每次用户滚动时都会被覆盖超时。这样，当他在一定程度的毫秒后停止运行脚本时，但如果他在此期间滚动，计数器将重新开始，脚本将等到他再次完成滚动。

You can make the scroll() have a time-out that gets overwritten each times the user scrolls. That way, when he stops after a certain amount of milliseconds your script is run, but if he scrolls in the meantime the counter will start over again and the script will wait until he is done scrolling again.

更新：

因为这个问题再次得到了一些动作我想我也可以用jQuery扩展来更新它添加 scrollEnd 事件

Because this question got some action again I figured I might as well update it with a jQuery extension that adds a scrollEnd event

// extension:
$.fn.scrollEnd = function(callback, timeout) {          
  $(this).scroll(function(){
    var $this = $(this);
    if ($this.data('scrollTimeout')) {
      clearTimeout($this.data('scrollTimeout'));
    }
    $this.data('scrollTimeout', setTimeout(callback,timeout));
  });
};

// how to call it (with a 1000ms timeout):
$(window).scrollEnd(function(){
    alert('stopped scrolling');
}, 1000);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div style="height: 200vh">
  Long div
</div>

这篇关于用户停止滚动时的事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！