Jump to content
Search Community

Repeat Not starting from beginning of timeline

G2MJeff test
Moderator Tag

Go to solution Solved by Carl,

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

Hey everyone, I have hit a snag in my development. I have created a new timeline that i want to repeat once it finishes.It seemingly works but for some reason it doesn't start the repeat from the first tween but instead the second tween in the list

tlMain = new TimelineMax({repeat:-1});

tlMain
//I WANT the repeat to start from here in the timeline and play ALL tween below BUT...
    
    .fromTo(Pocket, 0.5, {scaleX: 3, scaleY: 3, autoAlpha: 0}, {scaleX: 1, scaleY: 1, autoAlpha: 1})

//Repeat seems to start here in the timeline instead, skipping the first part of my animation
    
    .fromTo(Pocket, 0.1, {scaleX: 1, scaleY: 1}, {scaleX: 1.04, scaleY: 1.04}, '-=0.05')
    .fromTo(Pocket, 0.15, {scaleX: 1.04, scaleY: 1.04}, {scaleX: 1, scaleY: 1}, '-=0.05')
    .fromTo(Crumbs1, 0.1, {x: '-10px', scaleX: 1.01, scaleY: 1.01, autoAlpha:0}, {x: '-5px', scaleX: 1, scaleY: 1, autoAlpha:1},"-=0.15")
    .fromTo(Crumbs2, 0.1, {x: '-10px', scaleX: 1.01, scaleY: 1.01, autoAlpha:0}, {x: '-5px', scaleX: 1, scaleY: 1, autoAlpha:1},"-=0.2")
    .fromTo(Crumbs3, 0.1, {x: '-10px', scaleX: 1.01, scaleY: 1.01, autoAlpha:0}, {x: '-5px', scaleX: 1, scaleY: 1, autoAlpha:1},"-=0.3")
    .fromTo(LogoContainer, 1, {y: '-175px'}, {y: '0px'})
    .fromTo(line1, 0.25, {x: '-5px', autoAlpha:0}, {x: '0px', autoAlpha:1})
    .fromTo(line2, 0.25, {x: '-5px', autoAlpha:0}, {x: '0px', autoAlpha:1})
    .fromTo(line3, 0.25, {x: '-5px', autoAlpha:0}, {x: '0px', autoAlpha:1})
    .repeat(-1).repeatDelay(2)//Repeat Call

can anyone see why it repeats starting after the first tween instead of starting from the very beginning of the timeline?

Link to comment
Share on other sites

  • Solution

Hi and welcome to the GreenSock forums,

 

Its always helpful to provide a CodePen demo: http://greensock.com/forums/topic/9002-read-this-first-how-to-create-a-codepen-demo/ so that we can test and edit the code in a live environment.

 

From just reading your code my guess is that you have an overwrite situation happening. This means you have scheduled multiple tweens to animate the same properties of the same object at the same time. In such a situation instead of having these tweens fight each other, the engine overwrites (kills) the existing tween and lets the most recent one win the battle and continue to live.

 

It looks like the second tween here is the issue:

 

 .fromTo(Pocket, 0.1, {scaleX: 1, scaleY: 1}, {scaleX: 1.04, scaleY: 1.04}, '-=0.05')
    .fromTo(Pocket, 0.15, {scaleX: 1.04, scaleY: 1.04}, {scaleX: 1, scaleY: 1}, '-=0.05')
 
notice how they both try to adjust the same properties of Pocket? The second tween starts 0.05 seconds before the first tween ends, thus killing the first tween. This means the first tween can not play on repeat of the timeline because it no longer exists. 
 
I'm doubtful you need 0.05 overlap or that anyone would miss it if its gone, so my first suggestion is to just remove it. 
 
OR you can set overwrite:"none" on the second tween like
 
.fromTo(Pocket, 0.15, {scaleX: 1.04, scaleY: 1.04}, {scaleX: 1, scaleY: 1, overwrite:"none"}, '-=0.05')

Also, when using multiple fromTo() tweens on the same properties of the same object you may want to use immediateRender:false as explained here:

 

https://greensock.com/immediateRender

 

Hopefully some of this helps. If you need more help a simplified demo with the smallest amount of code needed to illustrate the problem will be very helpful. 

  • Like 4
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...