Here's the scenario I'm coming across that's affecting my GSAP ScrollTrigger animations:
I have a home page that loads and animates.
When I scroll down the home page, scroll trigger behaves normally.
When I get to the bottom and decide to use the navbar to navigate to another page (I'm using the Nextjs <Link>
component here), it sends me to the new page but starts at the BOTTOM Of the new page and quickly scrolls to the TOP of the new page.
This is a problem because it triggers all of my GSAP animations simultaneously for that page.
Is there a way to switch to a new page but START at the top— rather than start where ever you are in the y-position and scrolling to the top of the new page?
Essentially what's happening is that when I click on a <Link
> component in Nextjs, the y-position of my viewport is retained during page transition. Once I'm on the new page, I'm still on that same y-position of the previous page, but then it SCROLLS to the top. This is bad because it triggers all of my GSAP animations.