jQuery を使用してユーザーがスクロールを停止したことを検出するにはどうすればよいですか?

ユーザーのスクロール停止を検出する jQuery の Scroll イベント

jQuery のscroll() イベントは、ユーザーがスクロールしていることを検出するのに役立ちます。ただし、特定のシナリオでは、スクロールがいつ停止したかを知る必要もあります。

解決策:

これを実現するには、scroll( )、clearTimeout()、setTimeout()。

$(window).scroll(function() {
    clearTimeout($.data(this, 'scrollTimer'));
    $.data(this, 'scrollTimer', setTimeout(function() {
        console.log("Haven't scrolled in 250ms!");
    }, 250));
});

その方法は次のとおりです。 works:

1. ウィンドウにscroll()イベントハンドラを登録します。
2. ハンドラ内で、既存のスクロールタイマー(clearTimeout())をクリアします。
3. 設定setTimeout() を使用して遅延 (例: 250ms) を指定した新しいスクロール タイマー。
4. Ifタイマーが期限切れになる前にスクロール イベントが発生し、既存のタイマーがクリアされ (clearTimeout())、新しいタイマーが設定されます。
5. スクロール イベントが発生せずにタイマーが期限切れになった場合は、ユーザーがスクロールを停止したことを意味します。 .

jQuery を使用した拡張Extension:

別のアプローチは、「jQuery.unevent.js」と呼ばれる jQuery 拡張機能を使用することです。

$(window).on('scroll', function(e) {
    console.log(e.type + '-event was 250ms not triggered');
}, 250);

on( ) メソッドを使用すると、イベント トリガー間の最小間隔を指定できます。

この利点アプローチ:

• スクロール イベントの停止を処理する明確で簡潔な方法を提供します。
• アプリケーションの要件に合わせて遅延を調整できます。
• スクロールが停止したときに、透明効果の復元やレイオーバーの削除などのアクションをトリガーするために使用できます。要素。

以上がjQuery を使用してユーザーがスクロールを停止したことを検出するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。