Julien G Posted May 3, 2022 Share Posted May 3, 2022 Hello, i'm trying to make a hash link to work with ScrollTrigger and the pin functionality with no success... When the trigger is reached, an element containing the whole page is pinned, to stop everything during the animation. It seems that the link is pointing to the original location of the element (before ScrollTrigger resize the pinned element). I tried to locate the position of the element in the dom with element.getBoundingClientRect() to perform a scroll with window.scrollTo() but same issue, it returns the original location. How can I scroll to an element that is contained inside a pinned element? Maybe I'm pinning the wrong element? See the Pen BaYyvbK by juliengmd (@juliengmd) on CodePen Link to comment Share on other sites More sharing options...
Solution OSUblake Posted May 3, 2022 Solution Share Posted May 3, 2022 Hi Julien, Have you checked out the Helper Functions page? There are some functions in there for getting the scroll position. https://greensock.com/docs/v3/HelperFunctions#getScrollPosition 1 Link to comment Share on other sites More sharing options...
Julien G Posted May 3, 2022 Author Share Posted May 3, 2022 Thank you for your answer. It is working now with this function inspired by getScrollPosition from helper functions : function getScrollPosition(id: string) { const st = ScrollTrigger.create({ trigger: `#${id}`, pinnedContainer: '#pin', start: 'top top' }) const stStart = st.start st.kill() return stStart; } 1 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