iamruletik

@Rodrigo @Sveninyo Thanks for commenting. I couldn't replicate this problem in codepen. But I found solution after your comments. It was actually quite stupid. In webflow I had all pictures set to "lazy load" and when I set it all to "eager" everything start to work normally. I think this what caused layout shifts. Thanks @Rodrigo for heads up to check images and custom fonts.

Hi everyone! I'm also a noob to gsap and scrolltriger. And I encountered a problem with scrolltrigger. I have 3 animations on my website https://units-update.webflow.io/. Each uses scrolltriger. First 2 are working great. But when I get to the 3 animation i see that "start" and "end" markers are in wrong places. so as you see in screenshot I have div "#locations-slider" which way below than "start" marker is. my code actually is quite simple gsap.to("#locations-slider",{ scrollTrigger: { trigger: '#locations-slider', start: 'top top', toggleActions: "play none none reverse", scrub: 0.6, markers: true, }, xPercent: -70, }); but whe n I resize window it repositions where it should be What it could possibly can be? I've tried change layout, delete other animations, but no luck. Tried put Scrolltrigger.refresh(); I also checked this topic but it doesn't help PS: Here I checked site with devtools. And strangely I found layout shift when I reload page from this place and not from the start. Please guys help me, i'm miserable