jQuery を使用したページ スクロールをプログラムで無効にしたり再度有効にしたりするにはどうすればよいですか?

jQuery を使用したプログラムによるページ スクロールの無効化

JavaScript では、ページ スクロールの無効化は一般的なタスクです。 1 つのアプローチには、jQuery の CSS 操作機能を利用することが含まれます。この方法には 3 つの手順が必要です。

1. body{ overflow: hidden; を設定してページのスクロールを無効にします。
2. scrollTop() とscrollLeft() を使用して現在のスクロール位置をキャプチャします。
3. スクロール イベント ハンドラーを本文にバインドし、スクロール位置をキャプチャされた値にリセットします。

代替アプローチ

提供されたアプローチにより、ページのスクロールが効果的に防止されます。ただし、よりシンプルで包括的な解決策があります。

$('html, body').css({
    overflow: 'hidden',
    height: '100%'
});

このコードは、html タグと body タグの両方にオーバーフローを非表示にし、高さを 100% に固定するように設定することで、ページのスクロールを完全に無効にします。スクロールを復元するには、CSS プロパティを元の値にリセットするだけです。

$('html, body').css({
    overflow: 'auto',
    height: 'auto'
});

このソリューションは、Firefox と Chrome ブラウザの両方で効果的に動作することがテストされ、確認されています。

以上がjQuery を使用したページ スクロールをプログラムで無効にしたり再度有効にしたりするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。