Jump to content
Search Community

tweens after a "repeat:-1"

kvnmcwebn test
Moderator Tag

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

Hi,

What is the trick to get the timeline to carry on after the below tween loop in timelineMax?

.from(".class", 1.5, {  y:-100, repeat:-1, repeatDelay:3, yoyo: true})

I've not been able to find one for love nor money...

 

 

 

Link to comment
Share on other sites

By default, the insertion point of tweens is at the end of the timeline, so if you have an infinitely repeating child in the timeline, it'll push the insertion point waaaaaay out in the future (basically infinitely). So you'd need to define a specific time value as the insertion point thereafter (see https://greensock.com/position-parameter).

 

Alternatively, you could get the most recent tween and get its endTime that doesn't include repeats, like timeline.recent().endTime(false) and use that as the insertion time. 

 

In version 1.20.0, we improved the default behavior to do exactly that for you. It automatically senses when the timeline's duration is SUPER high, and assumes you don't really want the default at the very end, so it'll use recent().endTime(false) automatically in that case. So you might want to just try updating to the latest version (which is actually 1.20.2 today) and see if that resolves things for you, or just use one of the techniques I described above. 

 

If you're still having trouble, please post a reduced test case in codepen so that we can see what's going on in your case. 

 

Happy tweening!

  • Like 3
Link to comment
Share on other sites

Is there an updated modifiers cdn ?  Right now I have to load like this:

 <script src="js/ModifiersPlugin.min.js"></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/gsap/1.20.2/TweenMax.min.js'>
  
<script src="js/TimelineMax.js"></script>  

 

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...