i see that on toggeling we get the animation back. like i have a simple animation div that goes from 0 to 600px in y axis. the problem is when it reaches 600px it suddenly gets 0px instead of coming back as 599px , 598px ... to 0px. how can we do this without toggeling ? i even used reversed but i didnt got it reversed. im new to gsap
useEffect(() => {
const container = containerRef.current;
var tl = gsap.timeline({ repeat: -1, repeatDelay: 1 });
tl.from(container, {
y: "600px",
backgroundColor: "yellow",
color: "black",
duration: 1,
ease: "power1.inOut",
});
tl.to(
container,
{
y: "1px",
backgroundColor: "red",
color: "black",
duration: 1,
ease: "power1.inOut",
},
"+=1"
);
}, []);
