Show / Hide Hidden layer onScroll trigger

Hello,

I want to show, hide layers onScroll. So far here’s what I managed to do :
Two Div on top of each other, an overlay layer (absolute position) covering the whole image underneath.

The overlay layer has its opacity changing to 0% when scrolling into view.
Then I set the overlay layer to invisible (since I need to be able to click on the layer underneath in a second time allowing me to display a lightbox onClick).

I’d like to have the overlay be visible again when it scrolls out of view (so the animation will run again).
It only works if I change the transparency only. If I decide to hide (make invisible) the overlay layer, I can’t show it back.

Of course, it could be solved by moving the overlay layer underneath and play with the photography opacity, thus making the picture clickable but the overlay remains on top.

Any suggestions on how to make the overlay layer show after it’s been hidden?


Here is my public share link:
https://preview.webflow.com/preview/lesmainsvides?preview=41d9f78a3914f7909003b6f5e55bb846

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