支持从右向左和从下到上滚动的插件

Question

我得到了一个网页的项目，它需要以下行为：

简介内容以整页背景图像显示在屏幕上。

当用户向下滚动时，下一个内容部分向上滚动，以显示在具有其自己的背景图像的整页上。

当用户不断向下滚动时，下一个内容部分从右(到左)滚动，以显示其自身的带有背景图像的整页内容。

剩下的每一张幻灯片都会继续这种行为(从屏幕外的右侧滚动到左侧视图)。

我不确定我是否有时间构建一个自定义的解决方案，所以我希望有一个预先存在的库，它基本上允许我设置HTML属性来确定每张幻灯片的滚动/滑动方向。

如下所示：

<li class="slide active" scroll-direction="bottom-to-top">Slide 1</li>
<li class="slide" scroll-direction="bottom-to-top">Slide 2</li>
<li class="slide" scroll-direction="right-to-left">Slide 3</li>
<li class="slide" scroll-direction="right-to-left">Slide 4</li>
<li class="slide" scroll-direction="right-to-left">Slide 5</li>

Answer 1

对于复杂的滚动动画，请尝试使用ScrollMagic。看看这个demo，它似乎很符合你的需求。