タグ

ブックマーク / satohmsys.info (1)

  • javascriptでスマホのスクロールをキャンセルする方法(と、再開する方法|ツーブロッカ

    javascriptで、スマホのスクロールを制御する方法をご紹介します。 ハンバーガーメニューを開いたとき、画面のスクロールを停止する例を実装します。 ぼちぼち役立つ時があると思うので、頭の片隅に置いてみてください。 まずはデモをご覧ください。(スマートフォンで開いてください。PCだとイベントが発生しないので) removeEventListenerデモ 右上から展開するナビを開いている間はスクロールができません。 overflow:hiddenは間違い。たとえば、ハンバーガーメニューを開いたときに、body要素にclassをつけたりして「overflow: hidden;」すればいいんじゃね?と思いがちですが、これは誤りで、 iOSのsafariやAndroidChromeだと普通にスクロールできてしまうので、大抵のケースで、開いたナビの下に隠れているコンテンツがスクロールされてしまう

    javascriptでスマホのスクロールをキャンセルする方法(と、再開する方法|ツーブロッカ
  • 1