Holo_Back Posted Thursday at 07:13 AM Share Posted Thursday at 07:13 AM Hi all, I'm having this kind of sticky cards on our website and we experience that, when we resize the window, the Scrolltrigger doesn't refresh. Instead all cards are set to the end values (gsap.to(...) of the tween. The interesting thing is, that even triggering Scrolltrigger.refresh() on resize doesn't help, but triggering it two times in a row does help. Thanks in advance! See the Pen ZEdzQvv by pixit_design (@pixit_design) on CodePen Link to comment Share on other sites More sharing options...
Rodrigo Posted Thursday at 01:58 PM Share Posted Thursday at 01:58 PM Hi, This most likely stems from the fact that you're using position: sticky in your cards. Why not just let ScrollTrigger handle that with pinning and pinSpacing false: https://gsap.com/docs/v3/Plugins/ScrollTrigger/?page=1#pin https://gsap.com/docs/v3/Plugins/ScrollTrigger/?page=1#pinSpacing Here are a couple of simple demos: See the Pen bGZKWjp by GreenSock (@GreenSock) on CodePen See the Pen poBRQRj by GreenSock (@GreenSock) on CodePen Finally you could have a look at this guide @mvaneijgen wrote on the subject: Hopefully this helps. Happy Tweening! Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now