iphone - iPhone网站和第一次滚动时的位置固定延迟

Question

我在我的移动网站上使用 css 固定位置作为顶部和底部导航栏，我注意到我的 iPhone 浏览器（Safari 和 Chrome）上的一个错误：固定位置直到第一次滚动结束时才起作用......然后它适用于所有下一个卷轴。

例子 ：

http://jsbin.com/ugaraf/1

截图：

刷新后第一次向下滚动时出现错误：http: //goo.gl/yD5iz

然后工作正常：http: //goo.gl/mUKSn

你有同样的经历吗？有没有办法解决这个问题？谢谢。

Answer 1

我有一个带有固定顶部的网站，并且可以在 safari mobile 和 chrome 上正常工作。

这个特定 DIV 的 css 是

#navbar{

 width:100%;
 height:80px;
 background-color:#FFFFFF;
 border-bottom:4px solid #007f3f;
 position:fixed;
 z-index:10;

}

就我而言，z-index 是由于其他 div 位于position:relative.

至少对于排名靠前的，你真的不需要top:0 尝试没有它并发布一些反馈。

干杯。

Answer 2

这可以在 iOS 设备上启用硬件加速：

.youraffixelement {
   -webkit-transform: translate3d(0, 0, 0);
   transform: translate3d(0, 0, 0);
}