css - iOS溢出滚动不适用于下拉菜单

Question

有一个用于输入和选择字段的脚本https://joshuajohnson.co.uk/Choices/。我想用它来处理具有许多选项的选择字段。除了在 iOS iPhoneX 上滚动选项外，一切正常。在 drop domen select 中滚动是不可能的（整个页面正在滚动）。

下拉是一个可见性的 div：隐藏。单击该字段后，它会显示可见性：可见。奇怪的是，当基本可见性设置为可见性（加载页面后下拉可见）时，滚动工作正常。

知道有什么问题吗？如何解决？

附言。在 iphone 6 和 8 上它工作正常。

标签： cssiosselectscrolliphone-x

Answer 1

我想通了。

如果该元素被 visibility:hidden 隐藏，并且接下来要显示该元素，它被 visibility:visible 覆盖，则您无法在 iOS 13 iPhone X 上滚动浏览此元素。

解决方法是通过添加 position:absolute; 来隐藏元素。顶部：-9999px；并用 top:0 覆盖它来显示；

我不知道为什么它有效，但它有效:)

这不起作用：

.dropdownwithscroll {
visibility:hidden;
}

.dropdownwithscroll.active {
visibility:visible;
}

这项工作：

.dropdownwithscroll {
position:absolute;
top:-9999px;
}

.dropdownwithscroll.active {
top:0;
}