Weird Animation Happening with horizontal loop React

[Fenix Riper]

I was trying to implement a solution much like this one https://stackblitz.com/edit/vitejs-vite-auctqy,. However I'm getting the same problem, my sections are going over each other. Any ideas what might be causing this issue. I've also noticed if I define the size of my sections rather than let the text inside them define it, it works, but looks weird.

[Rodrigo]

Hi @Fenix Riper and welcome to the GSAP Forums!

 

Yeah I see that, the main problem in that demo was related to custom fonts, you need to create the loop after the font is ready and the text is rendered with that particular font:

https://developer.mozilla.org/en-US/docs/Web/API/Document/fonts

 

Here is the updated demo:

https://stackblitz.com/edit/vitejs-vite-auctqy?file=src%2FApp.jsx,src%2Findex.css

 

Hopefully this helps

Happy Tweening!

[Fenix Riper]

Yeah this worked, thank you for being so quick and helpful, will definitlty consider getting the premium version at some point ❤️