Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...

GSAP 3 Is Available Now!


| GreenSock
46949

GSAP 3 is the most significant upgrade we have ever had. With 50+ new features, there's a lot to be excited about. Here are a few of the highlights:

 

What's so exciting? What changed? 

There's a LOT to cover, so we broke this into a few articles. First, here are a few tasty morsels:

  • Roughly HALF the file size of the old TweenMax...but it has even more features.
  • New plugin for animating things along motion paths (you can even edit the motion path in the browser!)
  • Simplified API (no more TweenLite, TweenMax, TimelineLite, and TimelineMax - they're consolidated into a simple "gsap" object, yet we've maintained backward compatibility with the vast majority of legacy code!)
  • Timeline defaults that get inherited by child animations
  • 15 brand-new super-useful utility methods like interpolate(), random(), snap(), mapRange(), etc.
  • Keyframes
  • Effects extensibility
  • Animate to/from a width or height of "auto"
  • Built in modern ES6 modules format (but of course we provide files that work all the way back to IE9!)
  • Much, much more...

For details, make sure you read...

 

Demos

Here are some of our favorite demos so far (please send us yours!).

Check out the full demo collection for more. A special shout-out to @dsenneff who created the animation at the top of this page!

Jump right in - here's a starter codepen: 

 

More ways to play:

  • GSAP 3 Starter Pen - Fork the CodePen and away you go.
  • Download the files to use locally. 
  • Using a build tool? npm install gsap will get you the files. If you're a Club GreenSock user, there's a gsap-bonus.tgz tarball file in download that you can simply drop into your project's folder and then npm install ./gsap-bonus.tgz and BOOM, it'll be installed just like any other package! See the installation docs for more information.
  • The GSAP 3 docs

 

Tell us what you think!

Feel free to post in the our forums about what you like and any questions that you have. Or you can contact us directly if a public forum isn't your style.

Are you interested in having a GreenSock representative teach your team about the new version or speak at your next conference? Contact us and we'll do our best to make it happen!

Happy tweening!

Edited by GreenSock

  • Like 3

Get an all-access pass to premium plugins, offers, and more!

Join the Club

Have you exercised your animation superpowers today? Go make us proud and tell us about it.

- Team GreenSock


User Feedback

Recommended Comments

GreenSock

Posted

4 minutes ago, Qikker Online said:

What happened to throwProps on v3?

It's now called InertiaPlugin. It's even more streamlined and capable, but it does exactly what ThrowPropsPlugin did - it just has a more intuitive name now :)

  • Like 3

Share this comment


Link to comment
Share on other sites
Zaperela

Posted

Looks awesome! Super excited for keyframes and editing motion paths in browser! Mind blown... 

Thank you for the awesome tool!

  • Like 1

Share this comment


Link to comment
Share on other sites
hook

Posted

What are the browser compatibility levels? Specifically which versions of IE are supported?

Share this comment


Link to comment
Share on other sites
GreenSock

Posted

5 minutes ago, hook said:

What are the browser compatibility levels? Specifically which versions of IE are supported?

IE9+ and pretty much every other browser you can think of. Obviously certain features are browser-specific, like you can't do 3D transforms in IE9 because the browser itself can't recognize those (so they'd silently fail), but that's not a limitation of GSAP. The core of GSAP itself is pretty much universal. 

  • Like 1

Share this comment


Link to comment
Share on other sites


Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Add a comment...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

×