Html iOS上双滚动的溢出隐藏问题

问题是我有一个包含大量内容的主体（因为它会导致当前项目出现bug，所以无法对其进行定位修复），还有一个内部包含可滚动内容的模式，问题是在iOS上，如果我将溢出设置为隐藏，则什么都不会发生

在我的例子中，将

height:100vh

和

overflow:hidden

设置为

class=“parent”

不起作用

我尝试了不同的方法和方法来解决这个问题，但没有解决任何问题。我在这里看到了不同的方法，但适用于不同的情况

我也在寻找隐藏的替代方案，但还没有找到

如果你们有一些想法/参考/解决方法，请在这里发布，我很感激，谢谢

下面是片段

正文可滚动内容

模式可滚动内容

将溢出隐藏在html标记上可能会有帮助：

html, body {
  height: 100%;
  width: 100%;
  overflow: hidden; 
}

---

将溢出隐藏在html标记上可能会有所帮助：

html, body {
  height: 100%;
  width: 100%;
  overflow: hidden; 
}

---

通过将以下内容添加到您的css中，我获得了非常好的结果：

body.modal-open > .parent {
    position: fixed;
    overflow: hidden;
    height: 100%;
}

要使iOS设备上的模式“弹性”，请将您的

.container子项

css更改为：

.container-child {
    position: fixed;
    background-color: rgba(0,0,0,0.4);
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

    -webkit-overflow-scrolling: touch; /* <-- added */
}

.container子容器{
位置：固定；
背景色：rgba（0,0,0,0.4）；
排名：0；
左：0；
宽度：100%；
身高：100%；
-webkit overflow scrolling:touch；/*通过将此添加到您的css中，我获得了非常好的结果：

body.modal-open > .parent {
    position: fixed;
    overflow: hidden;
    height: 100%;
}

要使iOS设备上的模式“弹性”，请将您的
.container子项
css更改为：

.container-child {
    position: fixed;
    background-color: rgba(0,0,0,0.4);
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

    -webkit-overflow-scrolling: touch; /* <-- added */
}

.container子容器{
位置：固定；
背景色：rgba（0,0,0,0.4）；
排名：0；
左：0；
宽度：100%；
身高：100%；
-webkit溢出滚动：touch；/*为什么您的容器子容器
位置：固定的
而不是
位置：绝对的
？@Sam，因为它需要是您唯一能看到的东西（粘性）。为什么您的容器子级
位置：固定的
而不是
位置：绝对的
？@Sam，因为它需要是您唯一能看到的东西（粘性）。这可能会帮助99%有相同问题的开发人员，问题是在我的情况下，它会将内容从父级带到顶部（类似于scrollTop=0和位置：固定；top:0到正文）这不好。这可能会帮助99%有相同问题的开发人员，问题是在我的例子中，它将内容从父级带到顶部（类似于scrollTop=0和位置：固定；顶部：0到正文）这不好。在WebKit中修复之前，我会将其标记为最有用的解决方案。谢谢！我不认为这是一个bug。禁用反弹效果只能使用position:fixed来完成。在WebKit中修复之前，我会将其标记为最有用的解决方案。谢谢！我不认为这是一个bug。禁用反弹效果可以只能使用位置完成：固定。