yqlmichael

Not really a bug, but just trying to highlight this simply mistake with scrollTrigger in case anyone else runs into the same issue. It's really such a silly mistake and I'm a tad annoyed that I spent the past one and a half days wrecking my brain over one line of CSS. Basically, I was trying to pin a simple div to the top of the page using a scroll trigger. However, there would always be a visible snap/jump when the div became unpinned. Even after setting a value for anticipatePin, the pinning/unpinning would still be very choppy and glitchy. Took a look at the video for example. Long story short, I didn't realise that I had a line * { // some random stuff... transition: all 0.1s ease; } in my css file. I only realized that I was probably animating some CSS property after I had chanced upon @mvaneijgen's post somewhere quoting that you shouldn't animate any CSS properties during a Tween. After removing the transition rule, the scrolltrigger pinned perfectly. So to anyone who is facing a similar issue with their scrolltrigger jumping, do a quick check on your CSS and check if you have any transition animation rules. Hope this helps gsap-scrolltrigger-pin-jump.mp4