96

如果用户正在滚动,我如何在 javascript 中检测?

4

5 回答 5

94

这有效:

window.onscroll = function (e) {  
// called when the window is scrolled.  
} 

编辑:

你说这是 TimeInterval 中的一个函数。
尝试这样做:

userHasScrolled = false;
window.onscroll = function (e)
{
    userHasScrolled = true;
}

然后在您的间隔内插入:

if(userHasScrolled)
{
//do your code here
userHasScrolled = false;
}
于 2012-05-15T16:40:29.313 回答
11

您刚刚在标签中使用了 javascript,因此 @Wampie Driessen 的帖子可以帮助您。

我也想贡献,所以如果你需要,你可以在使用 jQuery 时使用以下内容。

 //Firefox
 $('#elem').bind('DOMMouseScroll', function(e){
     if(e.detail > 0) {
         //scroll down
         console.log('Down');
     }else {
         //scroll up
         console.log('Up');
     }

     //prevent page fom scrolling
     return false;
 });

 //IE, Opera, Safari
 $('#elem').bind('mousewheel', function(e){
     if(e.wheelDelta< 0) {
         //scroll down
         console.log('Down');
     }else {
         //scroll up
         console.log('Up');
     }

     //prevent page fom scrolling
     return false;
 });

另一个例子:

$(function(){
    var _top = $(window).scrollTop();
    var _direction;
    $(window).scroll(function(){
        var _cur_top = $(window).scrollTop();
        if(_top < _cur_top)
        {
            _direction = 'down';
        }
        else
        {
            _direction = 'up';
        }
        _top = _cur_top;
        console.log(_direction);
    });
});​
于 2012-05-15T16:58:43.090 回答
7
window.addEventListener("scroll",function(){
    window.lastScrollTime = new Date().getTime()
});
function is_scrolling() {
    return window.lastScrollTime && new Date().getTime() < window.lastScrollTime + 500
}

将 500 更改为您认为用户“不再滚动”的最后一个滚动事件之后的毫秒数。

(比前者addEventListener更好,onScroll因为前者可以与任何其他使用 . 的代码很好地共存onScroll。)

于 2018-09-19T21:36:18.053 回答
3

如果您想检测用户何时滚动到某个div,您可以执行以下操作:

window.onscroll = function() {
    var distanceScrolled = document.documentElement.scrollTop;
    console.log('Scrolled: ' + distanceScrolled);
}

例如,如果您的div在滚动到位置 112 后出现:

window.onscroll = function() {
    var distanceScrolled = document.documentElement.scrollTop;
    if (distanceScrolled > 112) {
      do something...
    }
}

但是正如您所看到的,您不需要div,只需要您想要发生的事情的偏移距离。

于 2021-02-23T02:27:44.327 回答
0

使用间隔检查

您可以设置一个时间间隔来继续检查用户是否已经滚动然后做相应的事情。

他的文章中借用了伟大的John Resig

例子:

    let didScroll = false;

    window.onscroll = () => didScroll = true;

    setInterval(() => {
        if ( didScroll ) {
            didScroll = false;
            console.log('Someone scrolled me!')
        }
    }, 250);

查看实时示例

于 2019-11-28T10:21:32.220 回答