大家好，在我们谈论网页动画时，我们第一时间会想到用jQuery的animate()方法或者CSS3的animation和transition。今天的这篇文章，我将给大家推荐另一个可选方案，一款专业的Web动画库GSAP，通过这款工具你能做出绚丽复杂的动画效果，通过本篇文章的学习，你将会学习到什么是GSAP，以及相关的入门基础知识。
GSAP全称是GreenSock Animation Platform，是一个JS动画框架。
GSAP有两个版本，一个为ActionScript 版本，已经在flash平台上运行多年，是一个“轻量级”、“高效率”、强大的2D动画引擎，一直深受ASer（学ActionScript的人都叫自己 ASer）的欢迎，学AS的人，没有一个说是不知道、没使用过GSAP的。
GSAP JS顾名思义是指GSAP的js版本，GSAP JS是GreenSock公司新出的一个2D动画引擎，可以说是AS版本的移植版，虽然功能还不够AS版本的完善，但是一样是非常强大、高效、好用的，据说它的运行速度是JQuery的20倍（动画方面的性能）。
有兴趣的可以访问官网，查看更多相关资料：https://greensock.com/
二、 GSAP的特点- 运行速度快，GSAP专注优化动画的性能，尽量接近与CSS一致的高性能。
- 轻量与模块化。将功能进行拆分，让核心框架保持轻量，TweenLite包非常小，同时提供了TweenLite, TimelineLite, TimelineMax 和 TweenMax不同功能的动画模块，可以按需使用，无需依赖。
- 零插件依赖，你不需要引入其他第三方插件。
- 灵活控制。不用受限于线性序列，可以重叠动画序列，你可以通过精确时间控制，灵活地使用最少的代码实现动画。
- 任何对象都可以实现动画。
说了这么多我们来看官方的视频介绍吧（英文原声视频，没有字幕翻译，请大家多多包涵），顺便练练英语听力。
GSAP既然这么好，我们如何安装和引用呢？
- 去官网下载核心库的JS文件：gsap.min.js，目前版本大小不到60K。
- 通过CDN的方式引用：
https://cdnjs.cloudflare.com/ajax/libs/gsap/3.2.4/gsap.min.js
- 通过npm或yarn安装，安装命令分别如下：npm install gsap yarn add gsap
- 同时还支持 React、Vue 、Angular
说了这么多，我们来看看如何使用，这里介绍的是JS原生的使用方式，如果你感兴趣 React、Vue 、Angular 的使用方式，请访问官网。这里我将通过心爱的小摩托示例，带着大家熟悉下最基础最核心的API。在介绍之前我们来听一段前段时间很火的音乐：我骑上心爱的小摩托，作为课前的案例预热，
