在iOS7中使用skrollr，skrollr-menu的視差站點存在問題

Question

我正在使用skrollr.js和skrollr-menu創建視差網站。 我有3個具有嵌套元素的div，我想以不同的速度進行視差處理。 一切都可以在桌面上正常運行，但是在運行iOS 7的iPad上，元素的放置方式和滾動速度遇到問題。 3個不同的div具有一類位置：固定，嵌套元素具有一類位置：絕對； 並使用top：px位於Y軸上（嘗試使用％代替混合結果）。 其他（非嵌套的，即#content）div似乎在所有瀏覽器和設備上均能正常工作。 我真的很感激任何問題的幫助，它使我發瘋了好幾天，這是我的第一個使用skrollr的項目，所以我沒有太多經驗，但是到目前為止，我很喜歡它，除了iOS上的這個小故障，我已經檢查了文檔和stackOverflow中的相關問題，但還是沒有運氣！ 希望有人能夠向我指出正確的方向，這是我試圖實現這一目標的方法的一個小提琴，盡管要在iOS中看到它，我必須很快提供一個直接指向該項目的鏈接，請耐心等待，因為我已經將現有項目移植到移動設備上以與skrollr一起使用，以便在提交之前盡可能多地清理代碼以避免混淆，與此同時，這是小提琴：

//Init Skrollr

$（document）.ready（function（）{var s = skrollr.init（{forceHeight：false，smoothScrolling：true，smoothScrollingDuration：150}）;

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

}）; }）;

http://jsfiddle.net/shinobisan/EvPdL/6/

謝謝！！

Answer 1

在移動設備上，使用CSS變換移動skrollr-body元素，這會破壞固定位置的元素。 請閱讀文檔的這一部分，我在第二段中對此進行了擴展。

從skrollr 0.6.0開始，您只需要做一件事：在頁面上包含ID為skrollr-body的元素。 這就是我們為了假冒滾動而移動的元素。 唯一的情況是，您不需要＃skrollr-body時就可以獨家使用位置：fixed。 實際上，skrollr網站不包含＃skrollr-body元素。 如果您需要固定和非固定（即靜態）元素，請將靜態元素放入＃skrollr-body元素中。

或者換句話說：在移動設備上，使用CSS變換移動skrollr-body元素。 您不能在根據CSS規范使用CSS變換的內部元素中具有position：fixed或background-attachment：fixed元素（ http://meyerweb.com/eric/thoughts/2011/09/12/un-fixing-fixed-elements -with-css-transforms / ）。 這就是為什么這些元素需要在skrollr-body元素之外的原因。

https://github.com/Prinzhorn/skrollr#what-you-need-in-order-to-support-mobile-browsers