[解決済み] jQueryでページスクロールをプログラム的に無効にする方法
2022-02-10 01:23:15
質問
jQueryを使用して、本文のスクロールを無効にしたい。
私の考えはこうです。
-
セット
body{ overflow: hidden;}
-
電流を捕捉する
scrollTop();/scrollLeft()
- ボディスクロールイベントにバインドし、scrollTop/scrollLeft をキャプチャした値に設定します。
もっといい方法はないのでしょうか?
更新しました。
私の例とその理由は、以下をご覧ください。 http://jsbin.com/ikuma4/2/edit
という疑問があることは承知しています。
position: fixed
をパネルに貼り付けています。
他の理由があるので、提案しないでください。
解決方法は?
私が見つけた唯一の方法は、あなたが説明したことと似ています。
- 現在のスクロール位置を取得する(水平軸を忘れずに!)。
- オーバーフローをhiddenに設定する(おそらく以前のオーバーフロー値を保持したい)。
- scrollTo()で保存したスクロール位置までドキュメントをスクロールする。
そして、再びスクロールを許可する準備ができたら、すべてを元に戻す。
編集:わざわざ掘り起こしたのだから、コードを渡せないわけがない...。
// lock scroll position, but retain settings for later
var scrollPosition = [
self.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft,
self.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
];
var html = jQuery('html'); // it would make more sense to apply this to body, but IE7 won't have that
html.data('scroll-position', scrollPosition);
html.data('previous-overflow', html.css('overflow'));
html.css('overflow', 'hidden');
window.scrollTo(scrollPosition[0], scrollPosition[1]);
// un-lock scroll position
var html = jQuery('html');
var scrollPosition = html.data('scroll-position');
html.css('overflow', html.data('previous-overflow'));
window.scrollTo(scrollPosition[0], scrollPosition[1])
関連
-
[解決済み] textareaのresizableプロパティを無効にするにはどうしたらよいですか?
-
[解決済み] ネストした多次元のjsonオブジェクトの書き方
-
[解決済み] Uncaught TypeError: 未定義のプロパティ 'ajax' を読み取ることができません。
-
[解決済み] jQueryで要素が非表示になっているかどうかを確認するには?
-
[解決済み] jQueryでチェックボックスに "checked "を設定する
-
[解決済み] jQueryでページを更新するにはどうすればよいですか?
-
[解決済み] jQueryで要素にスクロールする
-
[解決済み] jQueryで入力を無効化/有効化する?
-
[解決済み] スクロールした後に要素が表示されているかどうかを確認するには?
-
[解決済み】jQueryでチェックボックスがチェックされているかどうかを確認するにはどうすればよいですか?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み】Chrome Developer ToolsでリソースがDocumentと解釈され、MIMEタイプapplication/jsonの警告で転送される。
-
[解決済み】jQueryのセレクタにワイルドカードを使用した場合
-
[解決済み] フォーム送信のjQueryが動作しない
-
[解決済み] jQueryでリンクを無効化する
-
[解決済み] jQuery が Ajax 呼び出しの終了を待って戻るようにするにはどうすればよいですか?
-
[解決済み] jqueryでドロップダウンボックスを有効化/無効化する
-
[解決済み] JWplayer 再生クリックでフルスクリーン表示
-
[解決済み] jcarouselliteでbtnNextがクリックされたときに変数をインクリメントするには?
-
[解決済み] jQuery resizableを画像と結合する方法は?
-
[解決済み】スクロールを一時的に無効にする方法は?