Vilas

I think I have the exact issue as you. Is it the same as here? Basically a section that loads a bit slow, will mess up the triggers in the sections after it

Hi guys, I created this super basic codepen file to illustrate the issue. So the problem is that the middle section is waiting for some data before initializing the scrollTrigger+pinning. Once the data is loaded and the pinning happens, it throws off the position of all the scrollTriggers below it. Running scrollTrigger.refresh() doesn't seem to do anything in this case. How can i re-calculate the position of all the scroll triggers once the data finishes loading?

This is awesome! Thank you so much! So using the .call function injects the callback into the timeline and runs is every time the animation plays? but with updated parameters? That seems super useful!

Hi guys, I have a gsap timeline which animates an svg circle. (Scale and color). What I'm trying to achieve is to pass a dynamic color when clicking different buttons, for example: buttonA.addEventListener('click', (e)=>{runAnimation(DYNAMIC_VALUE)}); and then use that value here: tl.to(circles, { stagger:{ each: 0.05}, ease: "none", fill: `#${DYNAMIC_VALUE}` }) It seems that the dynamic value is always using the initial value but can't be changed later. Any idea on how to bypass this issue? Edit: seems that using a function + tl.invalidate() works, however, spam clicking the button seems to break the animation. Any ideas? Thank you in advance!