Question

TweenLite/TweenMax 是 GreenSock 动画平台中的核心动画工具，可用来构建补间动画(tween)。补间是 flash 时代的专业词汇，意思是在起始状态和终点状态之间补全中间过程。虽然现在我们使用动画这个词，但是其本质是不变的，仍然要包含四个要素：动画目标（target）、起始状态、终点状态、补间效果。例如将一个 div 从 opacity:1 经过 5 秒钟降低至 opacity:0

TweenLite.fromTo('div', 5, {opacity:1}, {opacity:0});
//动画目标：div
//起始状态：opacity:1
//终点状态：opacity:0
//补间：5 秒完成状态改变

起点状态经常可以省略，例如 div 以当前位置为起点，向右移动 300px：

TweenLite.to('div', 5, {x:300});

例子中使用的 CSS 属性动画（opacity、x 等）需要 CSSPlugin 插件支持，此插件包含在 TweenMax.min.js 中。如果你使用 TweenLite.min.js，需另外加载 CSSPlugin.min.js。

TweenMax 中文手册章节划分

• 关于设置动画目标和起始、终点状态的动画的结构化方法可参看01 节：动画结构
• 如果想要对动画进行一些初始化设置，如重复次数( repeat ) 缓动方式( ease ) 等可参看02 节：动画初始设置
• 03 节：动画事件中介绍了动画的事件函数，如开始事件( onStart )、结束事件( onComplete )、返回事件( onReverseComplete ) 等
• 常用的动画控制组件在 04 节：动画播放组件，如播放（ play ）、暂停（ pause ）、重新播放（ restart ）等
• 05 节：动画属性调整 列出了你可以获取到的动画属性以及调整他们的方法，如动画时长（ time ）、播放进度（ progress ）
• 06 节：实例属性 介绍了 TweenLite/TweenMax 实例的属性设置，如设置选择器、读取时间轴等
• 07 节：实例方法 介绍了 TweenLite/TweenMax 实例的函数方法，如删除动画、动画渲染

TweenLite 和 TweenMax 区别

我们的 API 文档大部分以 TweenMax 为例。如果你使用的是简约版的 TweenLite，把 TweenMax 改为 TweenLite 即可。
例如.to() 方法是公用的

TweenMax.to(obj, 1, {x:100});
TweenLite.to(obj, 1, {x:100});

我们已经在 API 上面标明了哪些方法是公用的，哪些是 TweenMax 独有的，下面是一个简要的列表

TweenLite 和 TweenMax 共有方法	TweenMax 独有方法
delay() delayedCall() duration() eventCallback from() fromTo() getTweensOf() invalidate() isActive() kill() killDelayedCallsTo() killTweensOf() pause() paused() play() progress() restart() resume() reverse() reversed() seek() set() startTime() time() timeScale() to() totalDuration() totalProgress() totalTime()	getAllTweens() isTweening() killAll() killChildTweensOf() pauseAll() repeat() repeatDelay() resumeAll() staggerFrom() staggerFromTo() staggerTo() updateTo() yoyo()

TweenMax 中文手册/TweenLite 中文手册术语说明

GSAP	GreenSock Animation Platform/GreenSock 动画平台
delayedCalls	延迟执行函数
eventCallback	事件回调函数
tween	动画/补间动画
starting value	起点属性
current values	当前属性
destination values/ending values	终点属性
stagger	错开
ease	时间曲线/速度曲线
timeline	时间轴
TweenLite/TweenMax	动画实例
TimelineLite/TimelineMax	时间轴实例
label	标记/标签
obj/target	动画目标/动画对象
kill	删除/清除/杀死