一般前臺做動畫有以下幾種方式：

1. 簡單的css transition動畫;

2. css animation動畫

3. javascript庫動畫

一般來說css html5動畫只適用于簡單的形變動畫，動畫操作的是css某個屬性。

但是對于更加復雜的動畫，我們可能必須通過javascript來做，其中greensock的gsap就是一個讓你發揮無限想象的強大工具

gsap還支持模塊化使用，這一點對于es6愛好者模塊化編程的工程師來說是一個福音，支持下面的應用模式

npm install gsap --save import {TweenLite, Elastic, TimelineMax} from "gsap"

gsap動畫原理是：

他有一個核心庫，可以對任何對象value值做tween過度，如果需要支持特殊的css屬性，則可能需要CSSPlugin,最大的TweenMax包含以下內容（好在我們可以通過上面的import命令選擇性地導入對應模塊！）：

TweenLite, TimelineLite, TimelineMax, CSSPlugin, RoundPropsPlugin, BezierPlugin, AttrPlugin, DirectionalRotationPlugin, and all of the eases like Power1, Power2, Power3, Power4, Back, Bounce, Circ, Cubic, Elastic, Expo, Linear, Sine, RoughEase, SlowMo, SteppedEase,

?

總結

以上是生活随笔為你收集整理的javascript animation lib greensock gsap介绍的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。