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.