Slider with two slides alternating infinitely - cross fade between them

Design help Animations & Interactions
1

I am wanting a simple slider using two images: ‘A’ and ‘B’
I want A to slide out to the right and fade to 0 opacity over 1 second while B slides in simultaneously going from 0 to 100% opacity (again, over 1 second)
B then pauses for a ‘look see’ for 1 second and slides out as A slides in and pause for 1 second for a ‘look see’

Long description summed up as: Slider with two slides alternating infinitely - cross fade between them

I’ve spent a few hours mucking around with slideers and I can get one slide to do what I want, and I can get the other slide to do what I want, but not the two of them in infinitely alternating succession.

I have tried using an interaction on each and I’ve tried using two interactions one one, with it affecting the second.

‘Loop’ is turned on, and Initial State is set on both.

Take a look and see what you can see!

Share link:
https://preview.webflow.com/preview/welop?preview=51f145fc8699b2a5fa66d88b77e7966c

Thank you!

2

Sigh…
I’ve retreated to a non-moving image with the Slider background being ‘A’ and ‘B’ being the only slide simply turning itself to 0 opacity, waiting, then going back to 100% opacity and waiting, and the loop starts over.

It kinda is what I wanted…
:-/

3

Though I would still like to have my original approach work!

4

This topic was automatically closed 125 days after the last reply. New replies are no longer allowed.