Fade-Reveal-Background-Image Fade Not Working

Hello!

First off, here’s my site, and you can see this issue on pretty much every page:

https://preview.webflow.com/preview/910zen-2020-a12?utm_medium=preview_link&utm_source=designer&utm_content=910zen-2020-a12&preview=1529618cf1b97becbc4a26eb466c0765&mode=preview

I must have messed something up because I did have working background/scroll Image fade interactions (as shown on this video from Pixelgeek: https://www.youtube.com/watch?v=a-P2PgG1JxQ&t=525s ). I’ve followed the steps and it worked fine. Now that it’s not working, I’m going back in and trying again (probably muddling things up more), but I keep getting those hard defined lines between section blocks. I can see some fading going on, but it’s not working right.

If anyone can figure out what I’m doing wrong, I’d love the help.

Thanks!
Tait

here is an example of the clear section dividers showing when is should be the smooth fade upon scroll…


Here is my public share link: https://preview.webflow.com/preview/910zen-2020-a12?utm_medium=preview_link&utm_source=designer&utm_content=910zen-2020-a12&preview=1529618cf1b97becbc4a26eb466c0765&mode=preview
(how to access public share link)

No thoughts on what I’m doing wrong here?

Hello @robertt8,

I didn’t see any problems on your preview, the sections have the fade in effect. could you be more specific as to when do you have a problem with your interaction?

thanks for the reply. I’m getting clear. section divides…not the smooth full fade for the different background.

Is this making sense?

Hello @robertt8,

So, on my end there is no clear divides, I get a smooth full fade, I made a short video of how I see it on my screen https://www.loom.com/share/500a3fce0001418dad13a9db8428c465. Try to reload your current window and see if that helps.

Whoa! Crazy. BTW, I’m on Safari. What are browser are you using? The odd thing is it worked perfectly fine when I was building it. It just suddenly stopped showing me the correct fades. I’ll check on other browsers. This also happens in Safari on my iPhone.

Hey @robertt8,

This interaction works on safari and chrome, I used it a lot. I think the problem could be on the other interactions that you have. I don’t know if you are using all of them, but if you are not, delete them, and only keep the ones that you want. Let me know if that helps.

Thanks @Pablo_Cortes. Is there a way to easily select and delete all unused interactions?

Yeah @robertt8, there is, if you hover over the interactions on the interactions panel, you will see that a trash bin appears, simply click on it and it will delete your interaction.

Oh…Yeah. I know how to delete them. I was wondering if there is a way to quickly select and delete unused interactions. I know I’m not physically using all of them, but I’m paranoid I’m going to delete something in use.

Thanks for the help.

2 Likes