menu
書いてる野郎
orebike@gmail.com
CSS/モーダル風UIで背面の本体のスクロールをロックする
CSS/モーダル風UIで背面の本体のスクロールをロックする
全画面に広がって画面を覆うような要素を作ってモーダル風UIを構築することがある。 この場合にそのモーダル風UI上でホイールを使うと、その背面にある本体のコンテンツがスクロールしてしまうということがおきる。これの防止方法。
スクロールバーがあるからスクロールするわけで、スクロールバーが出ないように制御してしまえばよい。
body{ overflow-y: hidden; }
このようなスタイルをUIの切り替え時に JS で脱着してやれば、表示がその時点で固定されてスクロールバーが消滅する。 スクロールバーが無いのでホイールにも反応しなくなる。
Tags
