clieee Posted October 5, 2021 Share Posted October 5, 2021 Hello, I have the following setup in a React project (next.js). Section 1: A sticky element that contains my scroll trigger for an element (lets call it containerRef) within this section that is top: 0 with position absolute Section 2: Static position Section 3: Static position Footer: Sticky element I've setup so my scrolltrigger fires a console log for onEnter, onLeave etc. from "top bottom" trigger position of containerRef. It works fine on page load when my page is scrolled up at the top, but if I reload the page from a scrolled down position it also fires the "onEnter" callback which will then start some animations on the Section 1, that are not within the viewport... How should I solve this? I've tried "limitCallbacks: true", but no success. It still fires even if Im scrolled down on the page when reloading. Thank you Link to comment Share on other sites More sharing options...
GreenSock Posted October 6, 2021 Share Posted October 6, 2021 Hi @clieee. Thanks for being a Club GreenSock member! 🙌 It's super difficult to troubleshoot blind - can you please provide a minimal demo? It sounds like the problem may be that you've got a position: sticky element that you're using as a trigger. I definitely wouldn't do that because it jumps out of the document flow when you scroll down, so when ScrollTrigger checks where it is in the viewport (to calculate the start/end values), it's in a funky position. I'd certainly recommend using a different element (maybe a wrapper) as the trigger instead. If you still need some help, a minimal demo will significantly increase your chances of getting an answer. Link to comment Share on other sites More sharing options...
clieee Posted October 6, 2021 Author Share Posted October 6, 2021 Sorry for not providing a demo. Thank you, will do the wrapper for this case. 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