Slider - animation before slide

Design help Animations & Interactions
1

Share link; https://preview.webflow.com/preview/tjg-slider-test?utm_source=tjg-slider-test&preview=d2418c27ce5b3d40a0d169b9f3d9912c

Hey you lovely Webflowers.

I have a slider with a ‘slide in’ interaction, and a ‘slide out’ interaction. What I’d like to happen is that the slide out interaction happens before it moves to the next slide.

Can anyone help?

1 Like
2

Not sure about the solution, but since the slider arrows are links I’m thinking about using a script that is usually used for page transitions.

Can you publish the project so I can try placing the script?

Here it is

<script>
$('a.left-arrow, a.right-arrow').click(function (e) {
    e.preventDefault();                   // prevent default anchor behavior
    var goTo = this.getAttribute("href"); // store anchor href

    setTimeout(function(){
         window.location = goTo;
    },1500);       
});
</script>

I really don’t know if this will work :smile: Maybe there’s a simple solution.

Piter :webflow_heart:

3

Hey @PeterDimitrov, thanks for this.

Here’s the published domain - https://webflow.com/design/tjg-slider-test

1 Like
4

Looks that the script isn’t working :smile: @PixelGeek Shared something with me that maybe can solve the issue. Here’s a link > https://www.youtube.com/watch?v=BR8EKsnTl4k&t=4189s

Piter :webflow_heart: