Streaming live at 10am (PST)

Slideshow Mask "active" Styling


#1

Hey guys,

I’ve created a slider in webflow and have styled it accordingly so the mask overflow is visible.

Is it possible to target the overflown content and drop it’s opacity similar to this screenshot?

Any suggestions would be a huge help. Many Thanks!

https://preview.webflow.com/preview/slideshow-382501?preview=11c83e3c054410b6871bb6e6cd8874e6


Here is my site Read-Only: LINK
(how to share your site Read-Only link)


#2

Yes. By using Interaction with a trigger dedicated to Slider elements’ content.

Look on this page http://sab.webflow.io/interactive-elements and search for this element:

(You can clone this site, follow the links on the top)

To make this slider I used the slider trigger in IX Legacy (1.0). But such a trigger exists in IX2 too. Select a slide, then create an interaction, when you’ll be ask for what kind of IX you want to make, select the slider one:

…then you will create animations for when the slide slides in, and when the slide slides out.

Here with IX1 I had selected the slide content and made an interaction with the slider trigger:

… and had defined an initial apparence with an opacity turned down, a rotation and a scale

And the interaction consist in turning those parameters to default when the slide comes in, and revert them when is goes out


#3

Wow, this is a really great resource.

Thanks so much for sharing this with me Vincent.

That effect is exactly what I was looking for!

Cheers,
Kane