Javascript iOS7中使用skrollr、skrollr菜单的视差站点问题

我正在使用skrollr.js和skrollr菜单创建视差网站。我有3个带嵌套元素的div，我想以不同的速度进行视差。在桌面上，一切都正常工作，但在运行iOS 7的iPad上，我遇到了元素定位和滚动速度的问题。3个不同的div有一个位置类：fixed，嵌套元素有一个位置类：absolute；使用top:px将和定位在Y轴上（尝试使用%而不是混合结果）。不过，其他（非嵌套的，即内容）div似乎在所有浏览器和设备上都保持一致。我真的很感谢任何帮助解决这个问题，这已经让我发疯好几天了，这是我第一个使用skrollr的项目，所以我没有太多经验，但到目前为止，我喜欢它除了iOS上的这个小故障，我已经检查了stackOverflow中的文档和相关问题，但仍然没有运气！希望有人能给我指出正确的方向，下面是我如何努力实现这一目标的一把小提琴，尽管要在iOS中看到它，我必须很快提供与该项目的直接链接，请容忍我，因为我必须移植一个现有的项目，以便在移动设备上与skrollr一起使用，所以我希望在提交之前尽可能地清理代码，以避免混淆，同时，这里是重点：

//Init Skrollr

$（文档）.ready（函数（）{ var s=skrollr.init({ forceHeight:false， 平滑滚动：真， 平滑滚动持续时间：150 }))

}))； });

---

谢谢

在移动设备上，使用CSS变换移动

skrollr body

元素，这将打断固定位置的元素。请阅读文档的这一部分，我刚刚用第二段对其进行了扩展

从skrollr 0.6.0开始，您只需要做一件事：在页面上包含一个id为skrollr body的元素。这就是我们为了假装滚动而移动的元素。唯一的情况是你不需要一个#skrollr身体是当使用位置：固定独家。事实上，skrollr网站不包含#skrollr body元素。如果需要固定和非固定（即静态）元素，请将静态元素放在#skrollr body元素中

或者换一种说法：在移动设备上，skrollr body元素使用CSS转换进行移动。在按照CSS规范（）使用CSS转换的元素中，不能有position:fixed或background-attachment:fixed。这就是为什么这些元素需要在skrollr body元素之外

---

非常感谢您的回复！我想我已经开始了解skroll body是如何工作的了，只是iOS的这个问题让我完全困惑了！我已经按照你的建议修改了小提琴，将视差元素放在了skroll机身的外面，但运气不好，这次它在我的屏幕上工作，但在iPad上它被发送到底部，在纵向模式下几乎看不见，在横向模式下也看不到。我在中添加了一个包含在content div中的target div来可视化问题，如果#非嵌套的img应该与target在屏幕和设备上的位置一致（第2节）。最好为您提供一个实例，但我的服务器目前处于关闭状态，希望fiddle可以帮助我们现在理解这一点。再次感谢您抽出时间调查我的问题！很抱歉，在你的小提琴中，我没有看到任何动画，只是滚动。更新：经过多次测试，我终于回到原来的项目，并应用了相同的原则。现在该网站在iPad上滚动时只出现了一些小问题！我将静态元素放在skrollr主体中，并按照您的建议保留所有固定的绝对位置元素，skrollr需要进行区分，以便正确滚动到一个元素，问题是内容被推到了页面底部，菜单试图访问内容，但无法访问。我现在遇到的问题是，在iPad skrollr菜单上从纵向模式切换到横向模式有点疯狂，但当我以横向模式重新加载页面时，一切都正常，从横向到纵向，这似乎都不会发生（我只能在iOS7 atm中进行测试）。为了排除css，我目前正在清理我的代码，值得注意的是，我在调用skrollr.init（）时使用了live example中的s.refresh（），尽管注释这一行不会改变任何东西。

    skrollr.menu.init(s, {
        easing: 'outCubic',
        animate: true,
        duration: 1000