Jump to content
Search Community

Repeating tweenFromTo

_andrewireland test
Moderator Tag

Recommended Posts

Hi, there!

Previously ZachSaucier provided me with some fantastic insight into his approach to a looping animation problem I was trying to solve. Due to some visual/design requirements I've ended up trying to achieve this using a slightly different method. Rather than the tween approach he used, I'm trying to loop a section of a timeline a specified amount of times.

Currently, I've tried doing this using the tweenFromTo method below. This works perfectly on the first scroll down and back up the page, but on subsequent scrolls the repeat no longer works.

.add(mainTl.tweenFromTo(0, "endLoop"))   
.add(mainTl.tweenFromTo("startLoop", "endLoop", {repeat:6}))

Is there a property I can use to change this behaviour, or do I need to look into another method to succesfully do this? I'd prefer to use the existing timelines if possible. 

I noticed in the tweenFromTo docs it says;


Also note that tweenFromTo() does NOT affect the timeline’s reversed property. So if your timeline is oriented normally (not reversed) and you tween to a time or label that precedes the current time, it will appear to go backwards but the reversed property will not change to true.

Is this part of the issue?

Thanks for any guidance you can offer,


See the Pen ZEGJQgV?editors=1111 by andrew-ireland (@andrew-ireland) on CodePen

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.
  • Create New...