.TimelineMax( vars:Object ) ;
new TimelineMax();
//如果使用TimelineLite，则用 new TimelineLite();
基础的使用示例
//创建一个重复3次每次1秒间隔的时间轴，当时间轴结束时执行myFunction()
var tl = new TimelineMax({repeat:3, repeatDelay:1, onComplete:myFunction});
//添加一个动画
tl.add( TweenLite.to(element, 1, {left:200, top:100}) );
//在时间轴末尾添加另一个动画
tl.add( TweenLite.to(element, 0.5, {opacity:0}) );
//通过.to()方法添加一个动画，添加于时间轴末尾后0.5秒处的
tl.to(element, 1, {rotation:30}, "+=0.5");
//反向播放时间轴
tl.reverse();
//在三秒钟处插入一个标签
tl.addLabel("spin", 3);
//在标签处插入一个动画
tl.add( new TweenLite(element, 2, {rotation:"+=360"}), "spin");
//跳转到标签处开始播放
tl.play("spin");
//在时间轴中插入另一个时间轴
var nested = new TimelineMax();
nested.to(element2, 1, {left:200}));
tl.add(nested);
| 参数名 | 类型 | 是否必填 | 描述 |
|---|---|---|---|
| vars | object | 否 |
配置你的TimelineMax，可配置时间轴选项和回调函数等，例如
|
.box {
width:50px;
height:50px;
border-radius:6px;
margin-top:4px;
}
.green{
background-color:#6fb936;
}
.orange {
background-color: #f38630;
}
.grey {
background-color: #989898;
}var myTimeline = new TimelineMax();
//添加动画至时间轴，时间轴长为6秒
myTimeline.add(TweenLite.to('.green',6,{x:600}));
//添加动画至时间轴绝对位置1秒处
myTimeline.add(TweenLite.to('.orange',2,{x:200}),1);
//添加动画至时间轴末尾（6秒处），时间轴长变成9秒
myTimeline.add(TweenLite.to('.grey',3,{x:300})); 转载原创文章请注明：文章转载自：TweenMax中文网 [https://www.tweenmax.com.cn]
本文地址：https://www.tweenmax.com.cn/api/timelinemax/TimelineMax()