javascript - 如何使用 Skrollr 在单个元素上设置多个 anchor 目标？

Question

是否可以使用 Skrollr 为单个元素设置多个 anchor 目标？例如，我需要如下内容:

<section id="main-slide"
                 data-start="background-color:rgb(255,255,255);"
                 data-top-top="background-color:rgb(255,0,0);"
                 data-anchor-target="#slide1"

                 data-top-top="background-color:rgb(255,0,0);"
                 data-bottom-top="background-color:rgb(0,255,0);"
                 data-anchor-target="#slide2">

所以，就好像我有第一组相对于#slide1的滚动动画，然后随着我继续滚动，我应该触发第二组相对于的滚动动画#slide2.

我试过上面的代码，但它没有让 Skrollr 正常工作。

我怎样才能有多个 anchor 目标？

Answer 1

我不认为这是可能的 - 您正在初始化相同的属性两次(data-top-top 和 data-anchor-top)。您可以尝试使用 skrollr keyframing将事件从#slide1 和#slide2 传送到您自己的事件处理程序。