ScrollTrigger - Numeric scrub throws console errors in GSAP core (Cannot read properties of undefined (reading 'totalProgress'))

[shard]

Hi, I just started with GSAP yesterday so it's likely that I'm doing something stupid, but I have a timeline/animation which plays fine on its own (i.e. without ScrollTrigger), and it also works with ScrollTrigger if I set the "scrub" parameter to true.  But if I pass in a numeric value to scrub (to add a delay/catch-up effect as documented here, it does not work and throws errors in the console.

 

I switched to the UMD GSAP files for easier debugging, and Firefox throws "Uncaught TypeError: lookup[i] is undefined" in _updatePropTweens on line 2846 of gsap.js.

Chrome throws "Uncaught TypeError: Cannot read properties of undefined (reading 'totalProgress')" at the same line.

 

What is it about my animation that doesn't work with delayed / catch-up scrub?

 

Thanks for any tips!

 

-Simon

See the Pen KKEWGZW by shards79 (@shards79) on CodePen

[GreenSock]

This issue looks like it's caused by the fact that you added a "stagger" to the defaults which is highly unusual. Did you know that will literally add a stagger to every tween? I certainly wouldn't recommend doing that. But I'll look into how to work around this in the next release. In the meantime, I'd recommend just moving your "stagger" from the defaults to each individual tween that you're creating. Sorry about any confusion there. 

[shard]

Thanks for the speedy reply, that does look like it fixed it.  I took the note in the docs about "if you find yourself repeating the same thing, put it in defaults" too literally I guess! 🤣

[shard]

Sorry for the double reply, is there a smarter way to have an array of elements play the same set of tweens in an overlapping sequence (i.e. so box 2 starts the first tween when box 1 is on its second tween)?  That's what I was trying to achieve with the stagger parameter here.

[Rodrigo]

Sure thing!

 

Just use a timeline and the position parameter:

See the Pen MWxpzzx by GreenSock (@GreenSock) on CodePen

 

@Carl has some great learning resources for staggers:

https://www.youtube.com/@snorklTV/search?query=stagger

 

Hopefully this helps.

Happy Tweening!