在你说这不可能之前，我知道这是不可能的。这是一个例子：http://victoriabeckham.landrover.com/INT
主要问题是 iOS 在滚动时冻结了 DOM 操作，因此您必须使用某种技术来克服该问题。我希望使用的视差插件是 stellar.js，但我遇到的问题是该插件的“iOS 演示”在桌面上并不能真正使用。我今天早上摆弄了 3 个小时，但无法获得在 iOS 和桌面上都能正常工作的设置。
我需要一些想法，或者是一种配置 stellar.js 以在两者上以相同方式工作的技术（我不确定这是否可能），或者另一个可以同时在两者上工作的库，或者也许对我如何能有一些见解自己编写一个解决方法。
感谢任何帮助。
【问题讨论】：
标签： javascript css ios parallax
第 1 步：像这样创建和对象
{
startFrameNumber: {
//first obj
id: idOfElement
duration: howeverManyFrames
startLeft: whatever
endLeft: whatever
startTop: stillWhatever
endTop: whateverAgain
},
nextStartFrameNumber: {
}
}
第 2 步：通过 CSS 使页面不可滚动，即 100% 的高度和宽度以及溢出：隐藏
第 3 步：当用户滚动时（通过自定义滚动条、键盘操作或触摸事件），根据滚动的距离或其他内容将动画推进 x 帧。如果您创建的动画对象有一个关键[帧]，则将其添加到可见和移动的事物队列中，并将队列中的所有这些事物移动到它们的适当位置和/或将它们从活动对象队列中删除
就是这样。移动物体的功能应该非常简单，除了让动画平滑需要一点时间。
【讨论】：
只需手动滚动每一层视差效果，自行控制，无需依赖浏览器的页面滚动。
【讨论】：
<div> 中，每个图层都有absolute 定位，然后只需根据视差计算更改计时器/事件的top 和left 属性。
在Zynga Scroller js library 的帮助下，我成功实现了跨设备/浏览器视差滚动。 它解决了您主要关心的问题之一，即点击和触摸事件的互操作性以及移动 webkit 设备上的滚动——这允许您在滚动时操纵 DOM。
然后，要创建视差效果，您有三个选择：
Here's a quick demo（使用现有示例代码）显示了视差滚动在桌面和移动设备上的流畅程度。当然，您仅限于支持 3d 转换的设备。请注意，Zynga Scroller 通过点击/触摸和拖动来工作——它可能不应该用作桌面解决方案，因为唯一需要的是 CSS 中的 overflow: scroll。
【讨论】：
查看 jQuery 插件“滚动路径”http://joelb.me/scrollpath 并将其与不同的层和速度相结合。您将认识到示例页面的滚动不仅仅是垂直视差阶段，而且在您上下滚动时还会水平移动图层。滚动路径可以做到这一点。
【讨论】：
尝试同时使用http://cubiq.org/iscroll-4 和 stellar.js。
【讨论】：
正常为桌面做视差处理，然后添加一个“touchmove”事件监听器来触发滚动事件：
document.body.addEventListener('touchmove', function(){$window.scroll()}, true);
在 iOs 5.1.1 的 iPad 2 上测试和工作
【讨论】：