GSAP 库几个文件之间的关系

最新推荐文章于 2025-07-07 12:41:51 发布

转载最新推荐文章于 2025-07-07 12:41:51 发布 · 264 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/pandoraCat/p/4409385.html

文章标签：

#javascript #ViewUI

本文深入解析GSAP（GreenSock）动画库，介绍其核心组件包括TweenLite、TimelineLite、TimelineMax和TweenMax的功能与作用。TweenLite作为基础，提供高效的时间动画控制；TimelineLite和TimelineMax用于管理和组合动画，增加复杂动画效果；TweenMax则集成了更多插件，增强动画创作能力。

1. 什么是 GSAP（GREENSOCK）： GSAP 是一套兼容主流浏览器的高性能的 html5 javascript 动画工具：GSAP 的 API 高效而紧凑；

2. TweenLite 是整个 GSAP（GREENSOCK）的基础。tweenLite 代码轻量级，而且高效； tweenLite 能够根据时间 tween 对任何对象(或者对象数组）的一个或者多个属性；

3. TimelineMax 扩展了 TimelineLite；TimelineLite 除了和 TimeLite 一致的 API 外，还额外的添加了一些诸如： repeat, repeatDelay, yoyo, currentLabel(), tweenTo(), tweenFromTo(), getLabelAfter(), getLabelBefore(), getActive() 等方法；

4. TimelineLite：TimelineLite 是一个用来创建和管理　weenLite, TweenMax, TimelineLite, and/or TimelineMax 的实例的轻量级的，直观的类；你可以把 TimelineLite 看成是一个可以放置 tween 动画的容器；

5. TweenMax: 扩展了TweenLite ，且添加了许多有用的特性；在 Tweenmax里面，许多插件是默认被添加进来的（如：CSSPlugin 等）；同时，TimelineLite ,以及 TimelineMax 也被添加了进来；

查看 TweenMax 源代码可以看到：

1. 包含 TimelineLite：

 _gsScope._gsDefine("TimelineLite", ["core.Animation","core.SimpleTimeline","TweenLite"], function(Animation, SimpleTimeline, TweenLite) {....｝

2. 包含 TimelineMax

_gsScope._gsDefine("TimelineMax", ["TimelineLite","TweenLite","easing.Ease"], function(TimelineLite, TweenLite, Ease) {....}

3. 包含 TweenLite

  var TweenLite = _class("TweenLite", function(target, duration, vars) {...}

参考链接：http://greensock.com/docs/#/HTML5/GSAP/

转载于:https://www.cnblogs.com/pandoraCat/p/4409385.html