【jQuery】スマートフォンやタブレット端末でのスクロールを無効にする方法。

Ads by Google

各種スマートフォンやタブレット端末でのウェブ観覧時に、スワイプやフリック等のタッチコントロールによるウィンドウのスクロールを禁止する方法を紹介します。

パソコンの場合、CSSで「overflow:hidden;」を効かせれば、スクロールさせなくすることが可能です。
これを各種タッチデバイスにも実装させるには jQuery を使う方法が便利です。

$(window).on('touchmove.noScroll', function(e) {
e.preventDefault();
});

これでスクロールが無効化されます。
もしスクロールを有効化させたい場合は、以下のコードを使います。

$(window).off('.noScroll');

上記、2つのコードを、スクロールを無効化させたいときと有効化したいとき、それぞれのタイミングで読むこむように記述すれば、スクロールの ON / OFF を切り替えられるようになります。

こちらの記事もいかがですか?

アナタにオススメ!
同じカテゴリーの他の記事です。

Ads by Google