Question

我正在对Timeline lite中的一些补间进行排序，但我希望它们中的一些同时发生在不同的对象上。没有onComplete函数有没有办法做到这一点。我目前的补间序列是：

tl.to($slideTitle, 0.3, {opacity: 0, left: -50 })
        .set($slideTitle, { css: { left: 50 } })
        .to($slideTitle,0.3, { opacity: 1, left: 0 })
        .to($slideDesc,0.3, {opacity: 0, left: -50 }) //Here is where I want a tween to happen to another item at the same time as I am animating $slideDesc
        .set($slideDesc, { css: { left: 50 } })
        .to($slideDesc,0.3, {opacity: 1, left: 0, onComplete: function(){

        }})

所以在那里，与$ slideDesc的第一个动画同时，我想要执行这个动画：

.to($bodyCopy,0.3, {opacity: 0, left: -50, delay: .05 })

我该怎么做？如果我只是在$ slideDesc之后将其粘贴在序列中，那么在$ slideDesc完成之后它才会执行。

Answer 1

你真的有两种选择：

创建标签并将位置参数设置为两者的标签物品
添加第二个补间并将其相反地抵消持续时间$slideDesc

所以说明一下：

// Your code
.addLabel('targetPoint')
.to($slideDesc,0.3, {opacity: 0, left: -50 }, 'targetPoint')
.to($bodyCopy,0.3, {opacity: 0, left: -50, delay: .05 }, 'targetPoint')

OR

// Your code
.to($slideDesc,0.3, {opacity: 0, left: -50 })
.to($bodyCopy,0.3, {opacity: 0, left: -50, delay: .05 }, '-=0.3')

Timeline Lite - 如何同时补间多个对象

1 个答案: