Product Carousel w/ GSAP (NEW POST)

Here's my codepen - https://codepen.io/Matt-CopOffMatt/pen/OJqvqVg I'm attempting to build a product carousel with GSAP I'm trying to stagger load each product card. I got the fade transition to work, but the stagger delay doesn't seem to be working properly. Any idea how to fix this? Also, when trying to animate the button fade in (changing opacity, then using transition: opacity 250ms ease) it doesn't seem to actually fade in, rather abruptly appear. Thank you
2 Replies
clevermissfox
clevermissfox5mo ago
Where is the transition? Like what element is it on? Don’t see it in css or js so assuming it’s in the tailwind classes but I don’t use tailwind so having trouble finding it. 250ms is also a very short duration, try extending to 1000ms and see if that does anything , will help debug where the problem is at least
Matt
Matt5mo ago
Ah I’m sorry, I doesn’t seem like I copied it over from my local version Just re-added. I figured out the issue actually. Instead of adding/removing a hidden class for the button, editing the style.opacity fixed that transition issue