【发布时间】：2011-04-12 08:04:51
【问题描述】：
我正在开发一个类似于 Google 地图的滚动/平移系统。该系统应该比“原始”（无缩放）简单得多，因此以非常直接的方式构建：
- 有一个包含 div 代表视口，溢出设置为隐藏和固定大小
- 此 div 包含另一个 div，该 div 正在根据鼠标移动进行平移
- 根据可见区域，将固定 div（或 imgs）添加到平移 div 以显示超大图像的某些部分
此设置按预期工作。尤其是在台式机上的常规浏览器中，它可以完美运行。滚动流畅。
但在 iPad 上并没有那么多：在这里，整个事情感觉非常缓慢。平移时有明显的延迟，并且点击记录需要很长时间。
首先要让它与触摸界面一起工作，我必须将触摸事件“转换”为鼠标事件。虽然没有这个很难测试性能差异，但我相信这不是问题的原因，因为在停用它时，简单点击的响应仍然同样低。
我试图通过简要查看 Google 地图本身（它在 iPad 上的效果与在其他任何地方一样好）来找出可能是什么原因，但无济于事（只是太复杂而无法获取一个快速的想法）。所以毕竟我认为这可能与移动 Safari 处理设置为“溢出：隐藏”的容器中的 div 的方式有关，一些缓存问题或我不知道的所需 JS 技巧。
知道我可以从哪里开始寻找吗？
【问题讨论】：
-
值得一提的是，我主要使用JQuery来处理事件。
-
很难说没有看到更多代码...您使用的特定 CSS 规则（除了溢出：隐藏）可能会对浏览器处理渲染的方式产生重大影响。例如，在 Google 地图中有一个容器 div，它有
position:relative（没有top或left属性），然后所有的后代元素都是position:absolute和left和top属性来处理平移。你有什么？ -
在我的配置中看起来很像这样。容器是绝对的，我现在已将其更改为相对，但它对整体拖动性能没有明显影响。
标签： jquery performance ipad safari ios