jQueryを使用して特定の位置で固定位置要素のスクロールを停止する方法は?

固定位置でのスクロールを停止する方法

固定位置の要素を、特定の点 (例: から 250 ピクセル) に達するまでページと一緒にスクロールしたいとします。ページトップ)、その後スクロールが停止するはずです。 jQuery を使用したソリューションを詳しく見てみましょう。

jQuery の実装

次のコードは、目的を達成します。

$(window).scroll(function() {
    $("#theFixed").css("top", Math.max(0, 250 - $(this).scrollTop()));
});

このコード内:

• $(window).scroll(function() { ... }) はイベントをバインドしますウィンドウのスクロール イベントのリスナー。
• ページがスクロールされると、コードは ID #theFixed を持つ要素の新しい位置を計算します。
• Math.max(0, 250 - $( this).scrollTop()) は、要素が上部から 0px を超えたり 250px を下回らないようにします。 page.
• $(#theFixed).css("top", ...) は、固定要素の新しい先頭位置を設定します。

実装例

次のフィドルは、それがどのように機能するかを示しています:

[JS Fiddle](フィドル URL を挿入)ここ)

以上がjQueryを使用して特定の位置で固定位置要素のスクロールを停止する方法は?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。