GSAP animation almost works on webflow site

Design help Custom code
1

Hi all,

Need some help with Gsap in webflow.

I want my text to stagger up each time I slide to the next project.
As you can see from the live link, the text staggers in opacity, but the y axis movement doesnt work at all. I’ve tried translateY and that doesn’t work either.

Im using Swiper JS for the project swiper and Gsap for the text animation.

I followed this tutorial to get the text stagger:

however it caused some errors with the way the rest of my code updates the titles (it essentially plays the text animation perfectly but does not update to the correct title, hence I couldn’t copy and paste it)

Hoping some code guru can help me out as I’m not the best codder and have honestly gotten this far with the help of Chat GPT.

Read only link:
https://preview.webflow.com/preview/vwhub?utm_medium=preview_link&utm_source=designer&utm_content=vwhub&preview=68a00dd178c37be51f7dff0e526320d1&locale=en&workflow=preview

Live link:
https://vwhub.webflow.io/

2

Okay got it to work! Turns out the y position transforms won’t work unless it’s in inline block or flex.

Found this forum post that helped.