在模式打开时禁用触摸滚动

Disable touch scrolling when modal is open

本文关键字:触摸 滚动 模式      更新时间:2023-09-26

我在移动设备上的网站上使用全屏模式。问题是触摸模态会导致正文页面移动,即使它是溢出:隐藏的;

以下是引导程序对此的看法:

支持溢出:隐藏在元素上非常有限 iOS和安卓。为此,当您滚动到顶部或底部时 在这些设备的浏览器中,内容 将开始滚动。

我能做些什么来防止这种情况发生?

将主体设置为位置:固定会导致滚动以丑陋的方式跳到顶部。如果有人想出一个最好的解决方案是什么?

我自己以前也有同样的问题。

我所做的是将正文更改为overflow:hidden并固定height等于模态height并记住文档滚动位置。关闭模态后,我已将记住的滚动位置向后应用并heightauto

它是如此复杂,因为我需要我的模态比窗口大,我希望能够滚动模态。