Lema

Hi everyone, I'm trying to create an animation in React Js, that will animate line starting from the 1st point, then it will go to 2nd, 3rd and etc when page loads, in total I'm planning to have 8 points on the page. If anyone knows how this idea can be implemented using gsap, I would be very grateful as I can't figure it out by myself. This is a link to codesandbox Any help and suggestions will be greatly appreciated, Thank you)

Hi, everyone. I'm new to GSAP, and I'm trying to add GSAP animation to create auto vertical scrolling boxes in my React app. Boxes are supposed to auto-scroll in a vertical position, while the box in the center has opacity 1, 2 other boxes will fade out until they're in the center. image of the animation I want to achieve. Codesandbox code is https://codesandbox.io/s/auto-scrolling-pv502. I was able to create 3 boxes, they auto-scroll only once, I can't figure out how to make them auto-scroll repeatedly and in order(so 1st box in the center =>2nd in the center => 3rd, and repeat). I tried to use repeat:-1, it doesn't allow to scroll boxes in order. Any help and suggestions are greatly appreciated, Thank you.