スマホメニュータップでスクロールを固定する方法

スマホのメニューをタップした時にスクロールをできなくなる方法を解説します。

メニュー出現時スクロールキャンセル

弊社サイトのメニュー出現時にもスクロールできないように実装しています。

Javascript

var state = false;
$('.navbar').click(function(){ //ナビバーをクリックすると
	if (state == false){
		$(window).on('touchmove.noScroll', function(e) { //スクロール禁止のイベント
			e.preventDefault();
		});
		state = true;
	} else {
		$(window).off('.noScroll'); //スクロール許可のイベント
		state = false;
	}
});

.navbarはサイトに合わせて変更してください。

Recruit

私たちは共に働く仲間を求めています。Web制作・広告運用・SEO対策・マーケティング・Web解析・メディア運用・ライティング・Webサービス開発が主な業務です。

PartnerShip

Web制作会社・広告代理店・デザイン会社・コンサルティング会社様

パートナー提携はコチラから

Contact

平日 10:00 - 19:00

TEL 06-6125-5439

無料相談

お問合せ

お見積もり