Scrollmagic添加结束触发器

Question

我第一次使用ScrollMagic，据我所知，我知道如何根据起始元素和持续时间触发我的动画

是不是可以设置结束触发而不是持续时间？

var smcontroller = new ScrollMagic.Controller();
var smscene1 = new ScrollMagic.Scene({
    triggerElement: "#products-box-1", 
    offset: 200, duration: 1600
})
.setTween(tweencan)
.addIndicators()
.addTo(smcontroller);

Answer 1

您可以将持续时间设置为某个div的长度。

持续时间：$（“＃divid”）。height（）

参考自：Scrollmagic duration

Answer 2

我发现的最好的方法是通过获取您尝试对齐的元素的高度和偏移量来计算从页面顶部到文档中该点的像素数，并将像素减去顶部要滚动的元素及其高度。

例如，如果您有一个包含<div class="rail">的右侧导轨，您想要沿着<container class="content">滚动，并且您希望该对象向下滚动到“内容”的底部：

duration = ($("content").offset().top + $("content").height()) - ($("rail").offset().top + $("rail").height().top);

一旦你看到它，它似乎很简单，但是在我意识到这很容易之前，我试图弄清楚如何做你想做的事情。