Search the Community
Showing results for tags 'setter'.
-
Tween the progress() and timeScale() of an animation
GreenSock posted a blog post in Learning Center
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. -
I want to extend the time of the timeline exactly in the current item, but without pausing, just extend the total duration. When I use myTimeline.totalDuration ( myTimeline.totalDuration () + 10 ) not works. The timeline continues with the current duration... My example code: trace(myTimeline.totalDuration()); //20 myTimeline.totalDuration( myTimeline.totalDuration() + 10 ); trace(myTimeline.totalDuration()); //20 //the final result should be 30... not?