Jump to content


TimelineMax: Squeeze or stretch the timeline length?

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

Is it possible to stretch or squeeze the length of a timeline by seconds? For example I have a timeline of 5 seconds, I would like to stretch it to 10secs, so it plays slower, and perhaps later squeeze it to 3 seconds so that it plays faster. I can't use timeScale, it doesn't work the way I am applying it.

Link to comment
Share on other sites

have you tried changing the timeline duration?


as described in GreenSock JavaScript API Docs:


myAnimation.duration( 10 ); //adjusts the timeScale of myAnimation so that it fits into exactly 10 seconds on its parent timeline

  • Like 3
Link to comment
Share on other sites

There is also a timeScale() method available:


timeScale() : http://api.greensock.com/js/com/greensock/core/Animation.html#timeScale()


Factor that's used to scale time in the animation where 1 = normal speed (the default), 0.5 = half speed, 2 = double speed, etc. For example, if an animation's duration is 2 but its timeScale is 0.5, it will take 4 seconds to finish. If you nest that animation in a timeline whose timeScale is 0.5 as well, it would take 8 seconds to finish. You can even tween the timeScale to gradually slow it down or speed it up.

var currentTimeScale = myAnimation.timeScale(); //gets current timeScale
myAnimation.timeScale( 0.5 ); //sets timeScale to half-speed


  • Like 1
Link to comment
Share on other sites

Thanks Peleg, I'll try that.

Jonathan, if you read my post to the end, I mentioned that I can't use timeScale.

Link to comment
Share on other sites

I'm curious - why can't you use timeScale()? It sounds like that's exactly what you'd need. You should be able to just set the duration() instead if you want, but that does exactly the same thing for timelines - it alters the timeScale. So you could do:

  • Like 1
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
  • Recently Browsing   0 members

    • No registered users viewing this page.