Swiper with gsap

[battleaxe10000]

Firstly, I tried to get my swiperSlider into codepen, but I didn't do very well there I'm afraid ()

 

I do, however, have a more working version i vscode (see image)

This slider autoslides and uses a fade-effect.

 

What I'm trying to do is implementing some gsap to this slider. The problem is that the animation only work on the very first slide.

 

I have tride refs, classNames, arrays, forEach, to write each "SwiperSlide" on its own (without looping), and more. But I always get the same result.

I get that gsap reccons the first slide and start the animation, but I can't seem to make it clear to gsap when a new slide enters.

 

Some help here would be great. Thanks

 

If you need more info, just let me know. (And of course, if you know how to get it done in codepen 👍).

See the Pen qBxawaz by battleaxe (@battleaxe) on CodePen

[Cassie]

Hey there!

 

This template may help - codesandbox is often easier for react stuff than codepen

https://codesandbox.io/s/vigorous-lamport-hlyzty

That being said, this looks like a third party library issue more than a GSAP one. You probably need to hook into swipers events

https://swiperjs.com/swiper-api#events
 

[battleaxe10000]

Thanks @Cassie,

I will look into that.