Animated slides help

Design help Animations & Interactions
1

Is this type of slider interaction/animation possible in Webflow (without custom code):

http://mutationmedia.net/MOUSIQUA/index.html

Specifically, I’m looking for how it slightly zooms in on the image during each slide.

I managed to get it working for the first slide, but applying the same settings to the sequential slides seems to cause them not to display. Am I missing something?

I can’t share the project link unfortunately (NDA), however I’m just using the vanilla slider component and applying the “slide” trigger interaction to each slide element. Each slide element has the classes “slide” > “slide xx”.

A working example or advice around the correct settings would be ideal. I’ve already watched/googled the tutorials, but haven’t found anything that relates to my specific example.

Thanks,
Alex

@PixelGeek - I think this may be your domain :upside_down_face:

1 Like
2

Hey hey @alexdixon

Check this > https://slider-ken-burns.webflow.io/

I think It’s almost the same :smile:

Clone and explore here > https://webflow.com/website/Slider-Ken-Burns

Piter :webflow_heart:

1 Like
3

Will check this out tomorrow morning, thanks for your assistance Piter :+1::nerd_face:

1 Like
4

Perfect – very helpful thanks Piter :raised_hands:t3:

For anyone else who comes across this situation, you need to create child elements within the “slide” element and then apply the interactions to those children (as opposed to the slide element itself). This also means you’ll need to apply your background images to the child elements too.

1 Like
5

I tried doing this and it worked well for the first slide… but every slide after that started way off screen. I have no idea what I’m doing wrong.