Transparent NavBar that turns opaque on scroll

Design help General
1

Hi there - I’m really struggling with this. I’m trying to follow this tutorial, posted in response to another user with a similar problem: - YouTube

However, due to a mixture of the interface changes, the fact I’m using a template (Marco) and my own inexperience, I’m having no luck. Any assistance you could offer would be GREATLY appreciated. Many thanks…

Here is my site Read-Only: https://preview.webflow.com/preview/kmerchantdesign?preview=eb74425ecfaa6696c6e0ac4cad8d353e
(how to share your site Read-Only link)

2

Hi :slight_smile:
HERE is one way using the page scroll interaction. This is good if you want it to turn white on the way up anywhere on the page.

HERE is turning white when scrolled into the Hero section

Hope this helps :slight_smile:

Ps. Sorry I’m so slow in the video, I have a fever. Takes time to think :stuck_out_tongue:

1 Like
3

Hi Kjell,

Many thanks for your help. Out of those two solutions, I found the second one to be the closest to what I wanted, but I appreciate you giving me a choice!

It also helped to see how interactions are handled differently now in the UI than they used to be (as seen in the older videos). Many thanks again.

Best, Karim

1 Like
4

Hi everyone,

I’ve the same issue and even when I’ve made the tutorial, it’s not working :frowning:
Could somebody help me whit this please?

https://preview.webflow.com/preview/asi-mx?utm_medium=preview_link&utm_source=designer&utm_content=asi-mx&preview=709667f466b5e1c3ab14025e43c223ea&pageId=5d07d5c80b3baf29a7a0d49d&mode=preview

1 Like