森のコーディング森のコーディング2016年02月マークアップエンジニアとかWEBディレクターとかをやってる僕が、自分が詰まって、解決したことをここに残しておきますよ。2月3スマホでメニューを開いた時に後ろはスクロールしないようにするカテゴリ:jQueryiphone/ipadサイト地味にはまってしまった。スマホサイトのメニューって大体ハンバーガーメニューだよね。(ハンバーガーメニューというやつ)これをタップすると、ズルーっとグローバルメニューがかぶさるようにおりてくる、というのが一般的。ページが動いてしまうという現象に悩まされた。タップでスクロールを禁止させるというのも見つけたが、メニュー内はスクロールできるようにしたいため、背景だけスクロールを不可にしたい。しらべてみたら、htmlとbodyに対して、height:100%とoverflow:hiddenを割り当てればよいということがわかった。実際に書くとこんな感じ。閉じるときは解除も忘れずに。$('#openMenu').click(function(){$('header').fadeIn();$('body,html').css({"overflow":"hidden","height":"100%"});});$('#closeMenu').click(function(){$('body,html').css({"overflow":"visible","height":"auto"});$('header').fadeOut();});手持ちのiphone6ではうまくいっている様子。-------------追記-------------------htmlも見たいというコメントをいただいたのでサンプルのhtmlのせますね。alt="menu"></a></nav></header>今回のサンプルだとこんな感じ。開くボタンと閉じるボタンがわかれてるパターン。長い英単語をいれるとtableの中をつきぬけちゃうイラレでスライスを速くするスクリプト。bluetoothヘッドセット1時間1円で暖かい。夏のPC仕事のおともに冷えピタ。クールヘッドで脳のスピードがあがります。お仕事のご依頼・お問い合わせはこちらコーディングのお仕事が得意です。