jquery - 如何为 Ipad 创建一个始终浮动在顶部的 div 而没有问题？

Question

我尝试使用position fixed，并在 Ipad 4 上进行了测试，非常错误。

1. 在页面上触摸拖动时，位置固定的 div 有时可以向下拖动。
2. 在放大/缩小时，div位置疯狂了一秒钟。
3. 当页面快速向下滚动时，div闪烁并可怕地摇晃
4. jquery 滚动动画性能极差，造成口吃

我的第二次尝试是在#container div 中制作内容并将固定对象（实际上是一个菜单）放在容器外，让#container overflow-y:scroll 并隐藏正文溢出。在 Ipad 4 上测试，问题是：

1. 势头停止了。这意味着当触摸滚动时，页面移动会在用户手指离开时立即停止，通常在用户手指离开后它应该能够滑动一点。
2. 我试图把 webkit-overflow-scrolling:touch; 对于#container，现在在ipad上它可以正常滑动，但在macbook firefox浏览器上，滚动被锁定，页面根本无法移动。
3. 如果我同时放置overflow-y 和webkit-overflow-scrolling:touch，ipad 将无法工作，但firefox 会再次工作。

关于为 Ipad 创建一个始终浮动在顶部的 div 没有问题的任何建议？我认为这应该是一个常见的问题。

Answer 1

我已成功将容器置于-webkit-overflow-scrolling:touch您声称无法正常工作的模式。

再试一次：

#container {
  overflow:scroll;
  -webkit-overflow-scrolling:touch;
  -webkit-backface-visibility:hidden;
  -webkit-transform:translateZ(0px);
}