Jump to content
GreenSock

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

Tween the progress() and timeScale() of an animation


| GreenSock
9726

Note: This page was created for GSAP version 2. We have since released GSAP 3 with many improvements. While it is backward compatible with most GSAP 2 features, some parts may need to be updated to work properly. Please see the GSAP 3 release notes for details.

Did you know you can tween a tween? What does that even mean? Well, tweens (and timelines) are JavaScript objects that have their own getter-setter methods that allow you to either get or set values. If you make a tween or timeline the target of a tween you can then tween its progress() and timeScale() just like you would the opacity of a DOM element! The video below explains how this works and also shows you how to tween getter setter methods in your own JavaScript objects.

Watch the video

Demo 1: Tween progress()

See the Pen Tween a tween (video) by GreenSock (@GreenSock) on CodePen.

Demo 2: Tween timeScale()

See the Pen Tween timeScale() of a Timeline by GreenSock (@GreenSock) on CodePen.

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

Join the Club

When is the last time you worked on something you love? Go animate something cool and then share it with us.

- Team GreenSock



User Feedback

Recommended Comments

There are no comments to display.



Guest
This is now closed for further comments

×