【JS】ページスクロールを停止させる方法

【JS】ページスクロールを停止させる方法

Webサイトによくあるハンバーガーメニューを開いたあとに、ページをスクロールさせない方法のメモ。

main.jsに下記コードを記載し、あとはスクロールを停止させたいところでscrollOff、スクロールを再起動させたいタイミングでscrollOnすればOKです!

  function noscroll(e) {
    e.preventDefault();
  }

  function scrollOff() {
    document.addEventListener('touchmove', noscroll, {passive: false});
    document.addEventListener('wheel', noscroll, {passive: false});
  }

  function scrollOn() {
    document.removeEventListener('touchmove', noscroll);
    document.removeEventListener('wheel', noscroll);
  }

ぜひ、参考にしてみてくださいー

Related pages

ブログ
【JS】ページスクロールを停止させる方法
ブログ
WordPressの記事でコードを見やすくするJSライブラリ
ブログ
inputタグへの疑似要素
ブログ
[WordPress] スマホ画面のときだけ右に余白ができる