Streaming live at 10am (PST)

Custom Slider In/Out Animations

Hey there,

Anyone know if there is a way to create completely custom animations for sliders. I’m using the Slider Change trigger to add in/out animations to the slides themselves, but the only way to be able to see them properly is to make sure that there is an animation set on the slider with a duration. The problem is that the animation cuts into the interaction I’ve created.

Is there any way, even using custom JS, to be able to disable the built in slider animations, while maintaining the duration property so that I can actually see the interaction.

Any help would be appreciated.


Here is my site Read-Only: https://preview.webflow.com/preview/kris-burnett?utm_medium=preview_link&utm_source=designer&utm_content=kris-burnett&preview=e2163e878c36b8e308e5958952623354&mode=preview

Hey @dmout

You need to set a duration in your home-listings-slider the same as the duration you’ll use inside the slides animation.

I could see in your code that you are applying the same animations in each slide. There’s a better way you can do this:

Inside the animation, change the “Affect:” to Class, instead of Selected Element and put Only children with this class. Then you can make the animation trigger to class and all your slides should have the same animations.