TweenMax.js 适用于全平台高性能专业级动画插件
TweenMax.js 适用于移动端和现代互联网的超高性能专业级动画插件，Tweenmax 是 GreenSock 动画平台的核心，配合其他插件可动画 CSS 属性、滤镜效果、颜色、声音、色彩、帧、饱和度、对比度、色调、色系、亮度、贝塞尔。
GreenSock 动画平台核心工具
TweenLite
TweenLite 是 GSAP 最基础的核心工具，其优点是快速、轻量级和灵活的功能，简单配置即可制作出丰富的动画效果。 TweenLite 还是 TimelineLite 和 TimelineMax 的默认生成的动画对象。 | TweenMax
TweenMax 在 TweenLite 的基础上添加了 stagger，repeat()，yoyo()等功能。 TweenMax 不仅仅是升级版的TweenLite，它还包含了许多额外的工具和插件以及时间轴，其功能非常全面。 |
TimelineLite
TimelineLite是一个轻量级，直观的时间轴类，用于构建和管理TweenLite、TweenMax、TimelineLite 和 TimelineMax 实例的序列。您可以将 TimelineLite 实例视为一个容器，可以随时放置 tween 或其他 timeline 在其中。 | TimelineMax
TimelineMax 提供 TimelineLite 完全相同的功能以及有用（但非必要）的功能，如repeat、repeatDelay、yoyo、currentLabel()、tweenTo()、tweenFromTo()、getLabelAfter()、getLabelBefore()、getActive() 等等。 TimelineMax 是 GSAP 最强大，功能最多的排序工具。 |
GreenSock 动画平台的基础插件
CSSPlugin
CSSPlugin用于在TweenMax中对DOM元素的CSS相关属性进行动画，如width, height, margin, padding, top, left以及2D、3D变形等。 | BezierPlugin
制作贝塞尔曲线动画。 | ScrollToPlugin
提供页面滚动或元素内滚动动画。 |
TextPlugin
文字动画插件，文字逐个显示的动画效果。 | Draggable
拖动插件。 | CustomEase
自定义时间曲线。 |
ModifiersPlugin
修饰返回值插件。 | AttrPlugin
DOM属性动画插件。 | ColorPropsPlugin
颜色相关属性动画插件。 |
CSSRulePlugin
样式表CSS样式动画插件。 | RoundPropsPlugin
动画数值四舍五入整数插件。 | DirectionalRotationPlugin
动画旋转方向控制插件。 |
RaphaelPlugin
Raphael属性动画插件。 | PixiPlugin
Pixi.js对象动画插件。 | EaselPlugin
EaselJS动画属性插件。 |
GreenSock 动画平台的商业插件
SplitText
SplitText 插件是GreenSock 动画平台用于将文本打散成数组从而进行动画。 | Physics2DPlugin
Physics2DPlugin 是GreenSock 动画平台用于进行物理动画的拓展插件，包括重力、速度、加速度、摩擦力动画等等。 | DrawSVGPlugin
DrawSVGPlugin是GreenSock 动画平台用于描绘SVG路径的插件。可以对SVG 的<path>, <line>, <polyline>, <polygon>, <rect>, <ellipse> 进行绘图动画。 |
MorphSVGPlugin
MorphSVGPlugin是GreenSock 动画平台用于SVG变形的插件，可以在各形状之间进行平滑的变形动画。 | GSDevTools
GreenSock 动画调试工具。 | ThrowPropsPlugin
投掷插件。 |
ScrambleTextPlugin
文字加密动画插件，使用随机字符对DOM元素中的文本进行加密。 | PhysicsPropsPlugin
对象属性物理动画插件。 | CustomWiggle
自定义摆动动画插件。 |
CustomBounce
自定义弹跳动画插件。 |
GreenSock 动画平台的特性
性能好速度快
性能最为重要，特别是在装载低性能CPU的移动设备上。
丝滑流畅的HTML5动画是所有动画引擎的目标，而GreenSock动画平台甚至超出“行业标准”10倍。这是无数次优化的结果，以确保你的互动项目的响应速度，效率和顺畅。
功能强大
GreenSock 动画平台是专业的动画工具，包含的许多强大功能使其他动画引擎看起来就像是小儿科。这些功能包括颜色，贝塞尔曲线，CSS属性，目标数组，页面滚动，获取/设定动画属性，自定义回调函数，以秒或帧为时间单位，毫不费力地构建序列，反向播放/反复播放和yoyo等等。
兼容
HTML5，SVG，jQuery，Canvas，CSS，新浏览器，旧浏览器，RequireJS，EaselJS，移动设备等等这些都没问题。可以在现代浏览器中加上各种3D变换（缩放，倾斜，旋转，x和y轴运动），甚至兼容IE6而不需要笨重的浏览器前缀和hack。我们来操心兼容性，因此你不需要，解决了这个HTML5动画最头痛的问题。
动画任何东西
是的，任何东西。没有预定义的属性列表可供选择。任何对象的任何数字属性都可以进行补间，如果该属性需要特殊处理（如颜色，过滤器，非数字值等），则可能要使用插件。
轻量级和可扩展
模块化，灵活且超高效，相对轻量化。GreenSock 动画平台以TweenLite为核心搭配其他插件。将TweenLite压缩到一个令人惊讶的小文件中。
没有依赖关系
GreenSock 动画平台不建立在jQuery之类的任何第三方工具之上的（尽管用jQuery作为选择器时效果很好）。这样可以最大限度地缩短加载时间并提高性能。
高级排序
你可以不仅限于“一个接一个”的动画排序。你可以按你想要的尽可能多的重叠动画。
在其他时间轴内嵌入时间轴、插入间隙，回调，标签，交错补间动画等等。
你可以精确控制时间和前所未有的灵活性，以最少的代码创建富有表现力的动画。
许可
除了非常具体的商业用途（转售给多个客户）之外，GreenSock的许可证完全免费，因此GreenSock的许可证使其非常易于使用且对商业友好，同时提供小型融资机制以维持持续的支持，增强和创新。
TweenMax 使用方法
greensock-js 文件包是免费开源部分，包含有核心工具、过渡时间曲线、基本插件、拓展插件等。此外，GreenSock还有一些商业插件。greensock-js文件包可以免费下载或使用CDN加载，商业插件不提供CDN，可以下载破解版或者购买授权后使用正版。
加载文件
必须要加载核心工具TweenLite.min.js或者TweenMax.min.js。此外还需要加载其他需要的插件，例如基础插件，时间轴，拓展时间曲线，商业插件等。
加载了相应的插件后即可使用相应的功能。
<script src="js/greensock-js/TweenLite.min.js"> </script> -- 核心工具，可初始化TweenLite对象<script src="js/greensock-js/plugins/CSSPlugin.min.js"> </script> -- 基础插件，用于制作CSS动画2D，3D动画
<script src="js/greensock-js/plugins/BezierPlugin.min.js"> </script> -- 基础插件，用于制作贝塞尔曲线
<script src="js/greensock-js/TimelineLite.min.js"> </script> -- 核心工具，创建时间轴管理动画
<script src="js/greensock-js/easing/EasePack.min.js"> </script> -- 拓展的时间曲线，例如bounce
建议在开发中使用TweenMax这个全功能的js文件，它包括了GreenSock动画平台的大部分核心功能。
使用TweenMax上面的加载可以简约为：
<script src="js/greensock-js/TweenMax.min.js"> </script>制作动画
动画的三要素：
- 1.动画目标对象
- 2.动画的持续时间
- 3.变化的属性
例：制作一个简单的CSS动画。
制作CSS动画需要用到CSSPlugin（已经包含于TweenMax）。
使用TweenMax的to()方法，将一个id为”obj”的DOM元素的CSS属性的left属性从当前值过渡到500px，从而产生移动效果。持续时间3秒。
TweenMax.to("#obj", 3, {left:500});left属性动画需要position:reletive支持，如需相对位置移动可使用x(CSS3的2D动画)更为简便
TweenMax.to("#obj", 3, {x:200});//在原有位置向右移动200pxTweenMax.to("#obj", 3, {x:200, y:100});//向右移动200px的同时向下移动100px
GreenSock 动画平台文件组成
以下表格展示了GreenSock动画平台包含的文件，CDN，免费文件，商业文件。
包含于 TweenMax
核心工具
- TweenLite
- TweenMax
- TimelineLite
- TimelineMax
基础插件
- Attr
- Bezier
- CSS
- DirectionalRotation
- RoundProps
核心时间曲线(包含于TweenLite)
- Linear
- Power0
- Power1 (a.k.a. “Quad”)
- Power2 (a.k.a. “Cubic”)
- Power3 (a.k.a. “Quart”)
- Power4 (a.k.a. “Strong” or “Quint”)
拓展时间曲线(EasePack)
- Back
- Bounce
- Circ
- Elastic
- Expo
- ExpoScaleEase
- Sine
- RoughEase
- SlowMo
- SteppedEase
拓展插件
- ColorProps
- CSS
- Rule
- Easel
- Modifiers
- Pixi
- ScrollTo
- Text
其他工具
- Draggable Requires CSSPlugin
- CustomEase Requires GreenSock account (free)
商业插件
- DrawSVG
- Physics2D
- PhysicsProps
- ScrambleText
- CustomBounce
- Requires CustomEase
- CustomWiggle
- Requires CustomEase
- GSDevTools
- MorphSVG
- SplitText
- ThrowProps
- Commercial license
以上是 TweenMax.js 适用于全平台高性能专业级动画插件 的全部内容， 来源链接： utcz.com/p/232377.html
