Unexpected behaviour when moving group

[jorma 16 Likes (Newbie)]

Please have a look at the CodePen. When I jump to a time in this CodePen after the animation has run once it jumps to a different location than expected. I expect it to jump to the 'ghost' location but it jumps to a different location. Am I doing something wrong? Thx!

See the Pen yLOaVMK by jormaturkenburg-the-typescripter (@jormaturkenburg-the-typescripter) on CodePen

[ZachSaucier 7,162 Likes (Superhero)]

Hey jorma. This is the expected behavior because you're first pausing the timeline (which prevents updates) then you're switching the time but since there's no more updates it doesn't display that new time.

 

The easiest solution is to just pass in the time to the .pause() method:

tl.pause('label');

 

[ZachSaucier 7,162 Likes (Superhero)]

I'm surprised that adding tl.time(0); fixes the issue. @GreenSock do you know why that is?

[jorma 16 Likes (Newbie)]

Hi Zach,

 

Thank you for the reply! I've forked and modified the Codepen. But the behaviour seems the same to me. When I wait for the animation to play once and then press 'Still' the group stops in the wrong position.

 

See the Pen JjXRpzj by jormaturkenburg-the-typescripter (@jormaturkenburg-the-typescripter) on CodePen

[ZachSaucier 7,162 Likes (Superhero)]

Ah, you're right. I must not have waited for the first iteration to complete before clicking. My fault. This definitely seems like a bug but it's 

 

An even more minimal timeline that reproduces the issue:

let tl = gsap.timeline({repeat: -1});
tl.to('#group', {x: 200});
tl.to('#group', {x: -400});
tl.add('label');

If you remove either of the first two tweens or change one of their targets to something else it seems to work.

 

.pause(0).pause('label') and similar also fix the issue...

[GreenSock 18,878 Likes (Superhero)]

Great catch! Yes, that's a bug. I believe it's fixed in the next release which you can preview at https://assets.codepen.io/16327/gsap-latest-beta.min.js

 

Here's a fork with the fix in place (and I made some of the code more concise, and sped things up so you don't have to wait so long for it to repeat): 

See the Pen 284cd0f3b918947dd6ceb9e6c4dce055?editors=0010 by GreenSock (@GreenSock) on CodePen

 

Better? 

[jorma 16 Likes (Newbie)]

A bug?! Hurray, I’m an official Greensock bug catcher. I shall celebrate in a fitting manner. 
 

And yes, that looks better. Although I kinda liked my old man slow version. 
 

Thanks again, for the quick and friendly response. 
👊🏻