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と言ったので、@WampieDriessenの投稿が役に立ちます。

私も貢献したいので、必要に応じて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より優れています。）onScrollonScroll

于 2018-09-19T21:36:18.053 に答える
3

ユーザーが特定のdivをスクロールしたときに検出する場合は、次のように実行できます。

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

たとえば、位置112までスクロールした後にdivが表示された場合：

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

ただし、ご覧のとおり、 divは必要ありません。何かを発生させたいのは、オフセット距離だけです。

于 2021-02-23T02:27:44.327 に答える
0

間隔を使用して確認する

ユーザーがスクロールしたかどうかを確認し続ける間隔を設定し、それに応じて何かを行うことができます。

彼の記事で偉大なジョン・レシグから借りています。

例：

    let didScroll = false;

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

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

実例を見る

于 2019-11-28T10:21:32.220 に答える