android - 移动(android 和 ios)浏览器忽略了隐藏在 body、html 和容器上的溢出

[复制链接]

菜鸟教程小白 发表于 2022-12-12 12:05:47 | 显示全部楼层 |阅读模式

▶ 语音朗读

我的网站有一些叠加层(灯箱)，当它们打开时，我需要防止页面在它们下方滚动。所以我使用了一点 jQuery 将 overflow: hidden; 添加到 body、html、#page。这在桌面浏览器上运行良好，但移动浏览器似乎不遵守规则。

我的页面结构是:

<html>
     ...
     <body>
          <div id="page">
          ...
          </div>
     </body>
</html>

我的 jQuery 只是在单击触发器时将类放在三个元素上。 jQuery 正在工作(应用样式)，我没有收到任何错误。

是否存在已知错误和/或已知修复？

Best Answer-推荐答案

使用大致相同的想法，但设置一个类 noscroll 而不是直接将样式应用于元素。

.noscroll { overflow: hidden; }

如果我没记错的话，它曾经可以工作，直到 iOS 7。

做了一些实验，看来这可以解决问题。

.noscroll { overflow: hidden; position: fixed; }

关于android - 移动(android 和 ios)浏览器忽略了隐藏在 body、html 和容器上的溢出，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/26288938/