【コピペ実装!!】スマホのメニュー展開時にスクロール禁止させる方法

スマホのメニュー展開時にコンテンツ部分がスクロールしてしまう。

スマホのメニューはアコーディオンであったり、横スライドメニューであったり、様々ですが、ボタンを押すと展開するタイプが多いですね。

その際にフリックするとコンテンツ部分がスクロールできてしまって困ることありますよね。

そんなときはコンテンツ部分となるbodyタグを固定して動かないようにしましょう!

下記のコードをコピペで実装!!

cssファイルにコピペ

jsファイルにコピペ

この場合、

  • メニューのボタンのクラスが.toggle(上記の5行目)
  • メニューの本体部分のulが.menu(上記の9行目・14行目)

であると想定していますので、ご自分の環境に合わせて変更してください。

 

投稿者:気まぐれWEBLOG管理人