GSAP

GSAP（Greensock动画平台）

GSAP是一个框架 - 不合时宜的JavaScript动画库，它将开发人员变成动画超级英雄。构建在每个主要浏览器中起作用的高性能动画。动画CSS，SVG，帆布，React，Vue，WebGL，颜色，字符串，运动路径，通用对象... JavaScript都可以触摸任何东西！ GSAP的Scrolltrigger插件以最小的代码提供了基于滚动卷轴的动画。 gsap.matchmedia（）使建筑物响应式，易于访问的动画变得轻而易举。

没有其他图书馆可以提供高级测序，可靠性和严格的控制，同时解决超过1200万个站点的现实问题。 GSAP围绕无数浏览器的不一致而进行。您的动画正常工作。 GSAP的核心是高速属性操纵器，随着时间的推移更新值以极高的准确性更新。它比JQuery快20倍！

GSAP是完全灵活的；在任何想要的地方撒上它。零依赖性。

有许多可选的插件和轻松功能可轻松实现高级效果，例如滚动，变形，沿运动路径或翻转动画进行动画。甚至还有一个方便的观察者，可以在浏览器/设备之间进行正常化的事件检测。

开始

文档和安装

在此处查看完整的文档，包括安装指南。

CDN

 < script src =" https://cdn.jsdelivr.net/npm/[email protected]/dist/gsap.min.js " > </ script >

有关核心文件/插件的快速链接，请参见JSDELIVR的专用GSAP页面。在GSAP.com上有更多的安装说明。

每个主要的广告网络都不包括GSAP从文件尺寸计算中，大多数都在其自己的CDN上都有它，因此请与它们联系以获取适当的URL。

NPM

请参阅此处通过NPM使用GSAP的指南。

 npm install gsap

GSAP的Core几乎可以动画所有内容，包括CSS和属性，此外，它包括所有实用程序方法，例如Interpaly（），MapRange（），大多数轻松，并且可以进行折断和修饰。

 // typical import
import gsap from "gsap" ;

// get other plugins:
import ScrollTrigger from "gsap/ScrollTrigger" ;
import Flip from "gsap/Flip" ;
import Draggable from "gsap/Draggable" ;

// or all tools are exported from the "all" file (excluding members-only plugins):
import { gsap , ScrollTrigger , Draggable , MotionPathPlugin } from "gsap/all" ;

// don't forget to register plugins
gsap . registerPlugin ( ScrollTrigger , Draggable , Flip , MotionPathPlugin ) ; 

NPM文件是ES模块，但是还有一个带有UMD文件的A / DIST / DIRECTORY，以供额外的兼容性。

从您的gsap.com帐户下载俱乐部GSAP会员插件，然后将它们包含在您自己的JS有效载荷中。您甚至还有一个tarball文件，您可以使用NPM/纱线安装。 GSAP也为会员提供了私人NPM注册表。在我们的论坛上发布问题，我们很乐意为您提供帮助。

scrolltrigger＆scrollsmoother

如果您正在寻找滚动驱动的动画，则GSAP的Scrolltrigger插件是新标准。还有一个伴侣卷轴。

使用反应？

有一个 @gsap / react软件包，它可以公开useGSAP()挂钩，该挂钩是useEffect() / useLayoutEffect()的置换式替换，自动化清理任务。请阅读React指南以获取详细信息。

资源

• gsap.com
• 入门指南
• 文档
• 演示和入门模板
• 社区论坛
• 轻松可视化器
• 展示柜
• YouTube频道
• 备忘单
• 免费尝试奖金插件
• 俱乐部GSAP（获取不在此存储库中的不受限制的奖金插件）

什么是GSAP俱乐部？

任何人都参加GSAP的主要原因有3个主要原因：

• 要访问MorphSVG，Splittext，ScrollsMoother等的唯一时尚插件。
• 获得特殊商业许可证。
• 支持正在进行的发展努力并为我们加油。

了解更多。

免费尝试所有奖励插件！

https://gsap.com/trial

需要帮助吗？

在友好的GSAP论坛中询问。或分享您的知识并帮助他人 - 这是提高您技能的好方法！也会报告任何错误（如果愿意，请在此处提出问题）。

执照

可以在https://gsap.com/standard-license上查看Greensock的标准“无费用”许可证。俱乐部GSAP成员获得了其他权利。有关详细信息，请参见https://gsap.com/licensing/。 GSAP为什么不使用MIT（或类似）开源许可证，为什么这是一件好事？本文解释了这一切：https：//gsap.com/why-license/

版权（C）2008-2023，Greensock。版权所有。