Question

我正在尝试按照滚动的例子实现视差滚动。

greensock文档说像TimelineMax.to这样的东西定义了该场景中元素的最终位置（而不是定义初始值的.from。）

但是我发现.to实际上会立即影响初始位置，尤其是当页面加载时元素位于视口顶部时。

例如：

.to($('.intro-header .bcg'), 3, {y: "80%",rotation:0.01, ease:Linear.easeNone});

会在页面加载时将我的元素 .intro-header .bcg 置于40％的位置，并且不会进行滚动！

我几天都在搔脑，但我无法解释为什么会这样。

只有当我将场景的持续时间设置为1200％时，元素才会在页面加载时显示在正确的初始位置，但随后场景发生得非常缓慢。

Answer 1

我发现问题不是在场景持续时间内，而是在triggerHook参数中。

此Scene参数on Scroll Magic上没有太多信息，但我的triggerHook设置为onEnter ...

我的错误印象是该值只能是onEnter onCenter onLeave，或0 0.5和1，但逻辑上它可以是介于两者之间的任何数字。

将其设置为0.1就可以了。在用户开始滚动之前，场景才会启动，因此所有元素都会在页面加载时显示在正确的位置。

在滚动的例子中，这一点并不十分清楚，所以我希望我的回答能够帮助其他人。