ScrollTrigger Messing up GatsbyJS Scroll Position
Hello,
I've setup the following 'Reveal' component to use on my current project (GatsbyJS) and found that when navigating to a new page after scrolling to the next one, the next page does not start a the top.
It basically sets up a ScrollTrigger on a given target element and can be passed an animation prop for different animations.
import React, { useRef, useLayoutEffect } from 'react';
import { gsap } from 'gsap';
import { ScrollTrigger } from 'gsap/ScrollTrigger';
gsap.regist
Thanks for your responses guys. I did add a cleanup/Scrolltrigger.kill() to my useEffect but it did not fix the issue. What does seems to have worked is adding a Scrolltrigger.refresh() in that useEffect. Not sure how that will impact performance though.
useEffect(() => {
gsap.registerPlugin(ScrollTrigger);
const target = targetElement.current;
animation(target);
ScrollTrigger.refresh();
}, [animation]);