1
これは重複しているように見えるかもしれませんが、私は以前の回答をサイトで見てきましたが、addEventlistenerを使用してモバイルでボディスクロールを有効/無効にする
だからここに行く。
私は機密情報のためにモーダル/免責事項を持つ義務があるページを作成しました。 私は、デスクトップとモバイルの両方で背景の本文スクロールを無効にできました。デスクトップでは、モーダルのボタンがクリックされた後にスクロールを再び有効にすることもできました。ただし、モバイルでは、モーダルでボタンをクリックした後にスクロールが無効に維持されます。あなたが見ることができるように、私はボタンをクリックすると、同じイベントリスナーの末尾に「真の」追加しようとしている
<script>
window.onload = function() {
$('body').css('overflow','hidden')
document.body.addEventListener("touchmove", function(event) {
event.preventDefault();
}, false);
document.getElementById('button').onclick = function() {
$('body').css('overflow','scroll')
document.body.addEventListener("touchmove", function(event) {
event.preventDefault();
}, true);
document.getElementById('modal').style.display = "none"
};
};
</script>
：
は、ここに私のJSです。これは、「固定」するためにあなたのモーダルコンテナスタイルの位置を設定することができます。おそらく最良の方法は、スクロールを無効にしようとしていない
あなたの返信ありがとうございます。ユーザーがスクロールすることができれば、コンテンツを見ることもできますバックグラウンドでは、モーダルでボタンを押さない限り、私はそれらを見ることはできません。 また、ページの上部が背景に表示されます。モーダルはビューポートの下部に配置されます –
したがって、本文のスクロールを避けるために、 "overflow：hidden"でページ本文を配置しようとすることができます。 –
こんにちは！再度、感謝します。あなたがコードを見れば、まさに私がやっていることです。私もiOSのためにそれをやっています。問題は、モーダルのボタンをクリックするとモバイルでスクロールを再び有効にする方法に関するものです。 –