接下来想介绍动态相关的JavaScript Library中，发展相当久、专门处理动态效果的 GSAP(GreenSock Animation Platform)；GSAP具有档案小效能高的优点，且浏览器的支援度高，适合应用於专案中专门来处理动态效果。
目前最新版本为GSAP3，一样提供不同的环境设置方式，这边一样使用最简便的CDN，在<head></head>间引入即可。
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.8.0/gsap.min.js"></script>
</head>
Tween 建立动画
指定网页元件、动态效果(关键影格)以及动画进行时间。以最基本的gsap.to()为例，传入函数的第一个值为指定的元件，第二个值使用则为包含动画结束状态与时间duration的物件，像是：{rotation: 27,opacity: 0.5, duration: 1}。
gsap.to()和gsap.from()：gsap.to()定义的CSS是动画的最後状态，也就是让这个网页元件依照时间定义，从原本的状态变成这里定义的样子；而gsap.from()则相反，这里定义的是开始状态。gsap.fromTo()：这个函式则融合上方的函式，开始与结束状态都在这里先定义好，因此第一个值指定好元件後，第二个和第三个值则分别加入开始与结束状态物件，一样需加入时间duration属性。gsap.to("#my-div", {rotation: 27, x: 100, duration: 1});
gsap.fromTo("#my-div", {opacity: 0}, {opacity: 0.5, duration: 1});
可以发现，像是之前的jQuery甚至是原生的CSS与JavaScript，要建立动态效果都会需要先指定网页元件、提供关键影格状态以及定义动态进行的时间，只是写法不同而已。
>>: 17 | WordPress 嵌入区块 Embed Block
这节向大家介绍一个好用的测试工具 - Postman。 Postman可以模拟程序呼叫API的行为，...
本期的主角是CheckBox，主要是提供一个或多个选项让使用者进行核选 首先我们可以在Design利...
作为一名 IT，和日志打交道是必不可少的，我们经常需要去查看一些日志文件，以从中获取一些有用的信息，...
我们终於完成了主机的弱点扫描 接下来，各系统的管理员该做些什麽呢? 弱点扫描有以下限制 仅能扫描已知...
之前我们有提到，JavaScript 如何与浏览器沟通，於是我们讨论到透过 JavaScript 取...