Jump to content
GreenSock

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

Start nested timeline not from beginning

Recommended Posts

Hello,

 

In my master timeline i would like to play child timelines not from the beginning, from the half for instance.

I've succeded in using the tweenFromTo() function.

But the problem is that i have to set the 2 values in seconds, and let's imagine if later i change the duration values in my timelines i will have to make a calculation again to find the 2 values and then change them. Not a convenient method.

 

Do you know if a better solution exists ?

 

Thanks a lot.

See the Pen qrQjMO by classikd (@classikd) on CodePen

Link to post
Share on other sites

What if you just used labels instead of specific hard-coded times? tweenFromTo("label1", "label2")

  • Like 1
Link to post
Share on other sites

Hmm. Is it possible to add labels between staggerTo animation steps ? Within a callback ?

Link to post
Share on other sites

I have succeeded in adding a label at half time of my staggerTo animation.

In my opinion it's a little bit tricky but i can' t find a better solution.

 

See the Pen gmZpNp by classikd (@classikd) on CodePen

Link to post
Share on other sites

I may be misunderstanding the desired outcome here, but couldn't you just use .progress(0.5) on your master timeline?

 

Happy tweening.

:)

Link to post
Share on other sites

Unfortunaly that's not working when i do:

tlMain
  .add(getTl().progress(0.5).play());
Link to post
Share on other sites

Thanks for your help PointC. That's definitly better than what i've done.

But the problem is that tl.duration() returns a number like 1000000000000 if i set the timeline to repeat:-1.

Do you think there is a way to make it working with infinite animation ?

 

See the Pen BWvKye by classikd (@classikd) on CodePen

Link to post
Share on other sites

You wouldn't have to use tl.duration()/2 like I did. I only did that so the nested timeline would play at the same speed as it was intended. When you tween progress like that, it doesn't have to be the same duration as the original timeline. You can tween the progress at a faster or slower rate if you like. In your demo we know the nested timeline with the staggers is 2.5 so you could simply hard code the duration of the tween to 1.25 if you like. 

 

Does that help at all?

 

I do have a question though. If that nested timeline is going to repeat infinitely, does it have to be part of the master timeline? Couldn't it just be on its own? It could even be in a function that calls itself again onComplete. Maybe that wouldn't work for you. I'm not 100% sure what your final need will be for this.

 

Happy tweening.

:)

  • Like 2
Link to post
Share on other sites

Yes it does help me a lot !

And you're right i think i'm going to use a function calling itself when completed instead of using the repeat attribute.

Because i encountered another problem, the timelines added after the infinite animation timeline are never played :D

I saw on an other post that using the callback method would solve this problem so i'm going to try that.

 

Thank you PointC.

  • Like 1
Link to post
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.

×