iPhone:固定位置Div不可见

Question

我在 http://www.getdripped.com/dev 有一个 Joomla 3 站点，我正在为其构建一个移动菜单。我让它在台式机上运行良好，但是当我尝试在 iPhone 上查看它时，菜单滑入但不可见。我仍然可以盲目点击，链接确实有效，但它完全不可见。更奇怪的是，当我再次单击按钮关闭菜单时，它会在抽屉关闭前突然出现一秒钟。我不确定是什么问题，有人可以帮忙吗？

我的iPhone是运行iOS8.2，我是在Safari里预览的。当我在 iPhone Chrome 应用程序中预览时，一切正常。在这里很困惑...

Answer 1

您的问题与 iOS 8 中出现的其他问题非常相似。-webkit-transform hack 的变体似乎也可以解决此问题。

将 -webkit-transform: translateZ(0); 添加到 body.open 选择器似乎可以解决问题。

body.open {
    -webkit-transform: translateZ(0);
}

iOS 8 似乎有一些分层问题，3D 变换能够抵消这些问题。这似乎与 OP 发现的 -webkit-overflow-scrolling: touch; 的使用有关。

将此添加到 iOS 8.

中的奇怪错误列表

iPhone:固定位置Div不可见

iPhone: Fixed position Div invisible

html

javascript

css

mobile-safari

ios