Make element change color when touching section

Hi all,

Any ideas on how to make an effect like the one on this site? https://marfajournal.com/

The idea is to have a fixed logo and make it change colors as on the Marfa Journal site, but also, to apply the same effect to some other elements using parallax. Hope someone can help.

Thanks,

Hi, @Jeandcc. I saw you just used fixed backgrounds using different images. That isn’t quite what I need, I need them to be separate elements and change when scrolling. Thanks anyway.

Hi, @Jeandcc! I found the solution, take a look at this. You can clone it if you want.

https://webflow.com/website/Change-Image-on-Scroll

I only added some CSS to Custom Code:

<style>
  .logo-wrapper {
    -webkit-clip-path: inset(0 0 0 0);
    clip-path: inset(0 0 0 0);
  }
</style>
1 Like

Super cool! I’m gonna check this out !

I’m happy for you and thanks for letting us know