我的绿色时间轴只执行第二个时间轴指令。如果我注释掉第二个,第一个补间工作。时机有什么问题?
tl.to($img, .3, {rotation: 0, ease:Linear.easeNone}, 0)
.fromTo($img, .3, {rotation: 0, ease:Linear.easeNone}, {rotation: 10, yoyo:true, repeat:-1, ease:Linear.easeNone}, 0);
答案 0 :(得分:1)
每个时间轴调用的最后一个参数称为位置参数。通过在两个方法调用上将该参数设置为0,您将告诉两个动画在时间轴的0秒标记处运行。这实际上是一个开始。因此,您要告诉两个动画同时执行,这就是为什么您只看到第二个动画,当您删除该调用时,您会看到第一个动画。 所以,如果你想让一个动画一个接一个地运行,你应该从第二个toTo调用中删除position参数。
您还可以定义偏移量,这意味着您可以将第二个动画设置为在第一个结束之前或略微之后稍微运行。你可以通过将position参数设置为' - = 0,5'来实现这一点。这将在第一个动画结束之前开始第二个动画0.5或者+ = 0.5'这将在.5秒之后开始动画。