webkit溢出滚动使元素消失

Question

我有一个应用程序/网站，我使用-webkit-overflow-scrolling: touch;在iOS上滚动平滑。

但是，最近它开始导致我的导航栏在初始加载（使用iOS）时消失，并且只有当某些元素向上或向下滚动时才会出现，导致导航栏完全无法使用。

如果我注释掉-webkit-overflow-scrolling: touch;，那么它可以很好地工作，但动量滚动消失了。我已经尝试在导航栏中添加一个z-index黑客，以确保它的所有内容都已加载，我还添加了一些不同的display属性，以查看我是否可以破解-webkit-overflow-scrolling: touch;，我甚至尝试将项目添加到内存使用-webkit-transform: translate3d(0,0,0);，没有任何工作。无论何时包含-webkit-overflow-scrolling: touch;，导航栏仍会消失/出现毛刺。

有没有人有过这个小故障，并找出它？我真的不想加载一个完整的JS库来处理我的滚动，但如果我无法弄清楚这个问题，我可能不得不这样做。非动量滚动感觉非常笨重和无法使用。

Answer 1

我有同样的问题。我有一个-webkit-transform: translate3d(0,0,0);的项目列表，只要我启用-webkit-overflow-scrolling: touch;就没有显示。我的问题是，我有-webkit-transform: translate3d(0,0,0);嵌套在另一个div内的元素。

换句话说，在溢出滚动触摸与touch3d的孩子之间有一个div。没有意识到他们必须是直接的孩子。

一旦我直接巩固我的div，它就不再隐藏元素并完美工作。希望能帮助到你。