Jump to content
GreenSock

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

GSAP 3 Is Available Now!


| GreenSock
124705

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!

  • Like 4

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

Join the Club

Cook up some delightful animation today with a generous dose of GSAP.

- 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

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 2

Share this comment


Link to comment
Share on other sites
ZachSaucier

Posted

On 11/27/2019 at 6:30 PM, AldiBatyr said:

well, here I am learning to use the previous version :(

You can learn the previous version here: 

 

Share this comment


Link to comment
Share on other sites


Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×