动画完成后的 TweenMax

【问题标题】：TweenMax after animation finished动画完成后的 TweenMax
【发布时间】：2016-05-20 19:46:36
【问题描述】：

当第一个动画完成后，我希望在同一目标上制作另一个动画。

var lnk = document.querySelector('#clickme');
var tl = new TimelineMax();

lnk.addEventListener('click', go, false);

function go(){
    tl.to('.glasko', 1, {width: 500, height: 500});
};

之后我想改变 div 的背景颜色。

tl.to('.glasko', 2, {backgroundColor: 'red'});

这方面的最佳做法是什么？

【问题讨论】：

标签： javascript animation gsap

【解决方案1】：

GSAP 让 TimelineMax 变得轻松简单。您只需要使用相同的TimelineMax 实例在第一个动画之后编写第二个动画，这是最好的方法。

var lnk = document.querySelector('#clickme');
var tl = new TimelineMax();

lnk.addEventListener('click', go, false);

function go(){
    tl.to('.glasko', 1, {width: 500, height: 500});
    tl.to('.glasko', 2, {backgroundColor: 'red'});
};

demo

【讨论】：