JavaScript
jQuery

jQueryでスマホのスクロールイベントを無効化する

JavaScript

// スクロール禁止
$(window).on('touchmove.noScroll', e => {
    e.preventDefault();
});

// スクロール禁止 解除
$(window).off('.noScroll');

使い方の例

メニューが開いているときはスクロールを禁止する。
メニューを閉じたときはスクロール禁止を解除する。

const $window  = $(window);
const $menu    = $('.menu');
const $menuBtn = $('.menu-btn');
let openFlag   = false;

$menuBtn.on('click', () => {

    if (!openFlag) {
        // スクロール禁止
        $window.on('touchmove.noScroll', e => {
            e.preventDefault();
        });

        // メニューを表示
        $menu.fadeIn(() => {
            openFlag = true;
        });
    } else {
        // スクロール禁止 解除
        $window.off('.noScroll');

        // メニューを非表示
        $menu.fadeOut(() => {
            openFlag = false;
        });
    }

});