视差滚动层动画最轻的JavaScript插件是什么？

我试图创造这种“视差”效果： （如

.homeSection--collection

部分）

它是一个包含三层的div，在滚动上具有透视效果。这个网站使用TweenMax，但对我来说，它似乎很难产生这样的效果

重建视差滚动效果的最简单和最轻的方法是什么

我试图清理

laruchquiditoui.fr

示例，以仅保留必要的代码：

我需要在一个页面上有多个实例，比如

laruchquiditoui.fr

website；如果可能，在此处输入与iPad兼容的代码

提前谢谢

我个人会使用视差，关于视差的教程很少

或者你可能更喜欢使用

---

还有一个纯CSS视差教程。

视差滚动的最小Skrollr设置，如您链接到的示例中的山脉：

HTML-在

标记内：

<div class="skrollr-body">

    <!-- 
      Put the slow image here. It will scroll only 500px for 1000 pixels of
      browser scroll, so 'half speed'. 
    -->
    <div id="splash" data-0="top: 0px" data-1000="top: -500px">
        <img src="..." />
    </div>

   <!-- 
    Put your normal image here, which will scroll with parallax over the above
    image. This will need a margin to push it below your fixed #splash. Set
    its margin-top to the height of #splash and set its position to absolute.
   -->
  <div>
      <img src="..." />
  </div>

</div><!--/.skroll-body-->

和一些JS来实现它。假设您正在使用jQuery，但在其他情况下需要document.onload：

$(document).ready(function() {
    skrollr.init()
});

把它放在你的

或

的底部

---

演示-

+1用于skrollr，但这不是一个权威性的意见，因为我还没有尝试scrollmagic，但在阅读了有关它们的内容后，skrollr对于最近的一个项目来说似乎是最简单的，当然对我来说效果很好。哦，skrollr看起来非常轻巧且易于使用。我会做一些测试。谢谢。我刚刚发布了一个简单视差的快速示例，让您开始学习。我第一次尝试时发现他们的演示示例有点复杂！Skrollr似乎是你的最佳选择。请注意，在ScrollMagic 2.0（目前处于测试版）中，您也可以在不使用TweenMax的情况下制作仅CSS的动画。我正在查看完整的CSS示例，它看起来非常有趣。谢谢

$(document).ready(function() {
    skrollr.init()
});