超高效能、最尖端網頁技術、職業級動畫效果
什麼是GSAP?(GreenSock Animation Platform)
由 GreenSock團隊提供的 Javascript 函式庫。您可以將它想成製作網頁動畫的瑞士刀……但好用的多。它將任何 JavaScript 可觸及的物件以網頁動畫呈現,可解決許多瀏覽器不相容的問題。檔案小、語法精練乾淨,使處理速度飛快(比jQuery快20倍),含有豐富的plug-in可擴充功能,簡單來說:GSAP是世界上最高效能又富有彈性的動畫函式庫。
Crazy fast
Performance is paramount, especially on mobile devices with sluggish processors. Silky smooth HTML5 javascript animation is the hallmark of any tweening engine worth its weight and GSAP outperforms old “industry standards” by literally 1000%+ under stress. What was jerky and twitchy is now fluid. It’s the result of countless optimizations made to ensure that your interactive projects are responsive, efficient, and buttery smooth. Check out the speed test for a head-to-head comparison.
Freakishly robust
HTML5 javascript animation built for professionals, GSAP is packed with features that make most other engines look like cheap toys. Animate colors, beziers, css properties, arrays, scrolls and lots more. Round values, smoothly reverse() on the fly, use relative values, automatically accommodate getter/setter functions, employ virtually any easing equation, and manage conflicting tweens like a pro. Define callbacks, tween in seconds or frames, build sequences effortlessly (even with overlapping tweens), repeat/yoyo and more.
Compatible
HTML5, SVG, jQuery, Canvas, CSS, new browsers, old browsers, React, Vue, EaselJS, mobile, and more – GSAP gets along with them famously. Use your favorite tools without jumping through endless hoops to ensure compatibility. It even accommodates various transforms (scale, skew, rotation, x, and y) in modern browsers plus IE back to version 6 without requiring clunky browser prefixes and hacks. We worry about compatibility so that you don’t need to. Another HTML5 javascript animation headache solved.
Animate anything
That’s right. Anything. No predefined list of properties to choose from. Any numeric property of any object can be tweened, and if the property needs special handling (like colors, filters, non-numeric values, etc.), chances are there’s a plugin that will do it. If not, one can be created. The possibilities are endless.
Lightweight & expandable
Modular, flexible, and ultra-efficient, its plugin architecture keeps the core engine tight while allowing virtually any feature to be added via optional plugins. TweenLite packs an amazing amount of power into a surprisingly small package.
No dependencies
The GSAP isn’t built on top of any 3rd party tools like jQuery (although it works great with jQuery). This approach minimizes load times and maximizes performance.
Advanced sequencing
You’re not limited to “one-after-the-other” sequencing; have animations overlap as much as you want. Nest timelines inside other timelines. Insert gaps, callbacks, labels, staggered tweens, and more. You get precise control over timing and unprecedented flexibility to create
Dedicated support
Everybody needs a little help sometimes. We’ve got your back. When deadlines are looming and you can’t figure something out, hop over to http://greensock.com/forums to get your GreenSock-related questions answered. With a proven track record of active participation by the author and an army of fellow users, GreenSock tools are unlike most open source projects that stagnate or offer zero support.
Permissive license
Completely free for everything except a very specific type of commercial use (reselling to multiple customers), GreenSock’s license makes it extremely accessible and business-friendly while providing a small funding mechanism to sustain ongoing support, enhancement, and innovation. The web is littered with abandoned “open source” projects, but GreenSock has a years-long track record of commitment to the platform.
GSAP Plus | GSAP Premium | GSAP Business | ||
Everything in GSAP |
Everything in GSAP Plus |
Permanent License |
Features | GSAP Plus | GSAP Premium | GSAP Business |
Notification of new features & bug fixes | V | V | V |
DrawSVG | V | V | V |
Physics2D | V | V | V |
PhysicsProps | V | V | V |
ScrambleText | V | V | V |
CustomBounce | V | V | V |
CustomWiggle | V | V | V |
ScrollSmoother | V | V | |
MorphSVG | V | V | |
Inertia | V | V | |
SplitText | V | V | |
MotionPathHelper | V | V | |
GSDevTools | V | V | |
Commercial License | V | ||
Multi-Developer Memberships Available | V |
DrawSVGPlugin
DrawSVGPlugin allows you to progressively reveal (or hide) SVG strokes to make them look like they're being drawn.
MorphSVGPlugin
MorphSVGPlugin provides advanced control over tweens that morph SVG paths. A huge advantage is that it doesn't matter if your start and end shapes have a different amount of points. MorphSVGPlugin can morph them seamlessly.
InertiaPlugin
InertiaPlugin allows you to smoothly glide any property to a stop, honoring an initial velocity as well as applying optional restrictions on the end value.
Physics2DPlugin
Provides simple physics functionality for tweening an Object's x and y coordinates (or "left" and "top") based on a combination of velocity, angle, gravity, acceleration, accelerationAngle, and/or friction.