xxxxxxxxxx
useEffect(() => {
gsap.to('.my-element', {
opacity: 0,
scrollTrigger: {
trigger: '.my-element',
start: 'top 80%', // start the animation when 80% of the element is visible
end: 'top 20%', // end the animation when 20% of the element is visible
toggleActions: 'play none none reverse', // play the animation when scrolling down and reverse it when scrolling up
},
});
}, []);