ios - ユーザーがスクロールできない部分をスクロールしようとしたときに、iOS で Web アプリ全体のスクロールを停止するにはどうすればよいですか?

Question

IOS 用の Web アプリを作成しました。ユーザーが Safari 経由でホーム画面に追加すると、スクロールできないアプリの一部を指で上下にスクロールしようとすると、アプリケーション全体が上にスクロールしたり、ダウンしてから元の位置に戻ります (Web ページの一番下までスクロールしてから、スクロールを続けようとしているかのように)。

そのように上下にスクロールしないようにする方法はありますか? オーバーフロー y 属性を本文、ドキュメント、ウィンドウを非表示に設定しても修正されません。

Answer 1

JavaScript を使用して touchmove イベントをリッスンしpreventDefault()、デフォルトの動作をキャンセルします。これにより、それらの要素からページを「ラバーバンド」することができなくなります。ユーザーがドラッグできないようにする要素については、次のようにしてください。

noScroll = document.getElementById("cant-touch-this");
noScroll.addEventListener("touchmove", function(e) {
    e.preventDefault();
});