Timeline Lite - как одновременно твист нескольких объектов

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

У вас есть два варианта действительно:

1. Создать ярлык и установите Расположите аргумент к ярлыку для обоих элементов
2. Добавить во втором твин и компенсировать это отрицательно тот же продолжительность $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') 

ИЛИ

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