Navbar animation

Design help Animations & Interactions
1

Hello,

I want to create a transparent navbar (only links and logo are shown), when I scroll down
I want the navbar become white, and it becomes transparent again only when I get to
the start of the page.

Thanks for your help :grin:
Avi

2

You can achieve this setting the interaction to the top section of your body that whenever it disappears the navigation bar changes colour to something specific and whenever the section appears the colour goes back to transparent.

3

Hi,

Thanks for your help but I’m not sure that I understand (it’s my first time using Webflow).
I’ve made a test page, I succeeded making the navbar white when scrolling
but I don’t know how to make it transparent again when I scroll up to the start of the page.

Please see the test page I made:
https://preview.webflow.com/preview/portfolio-a7eb54?utm_source=portfolio-a7eb54&preview=dfccd4439dd10e7745204a6790b976f1

4

Someone? help…?

5

@AviWhol Is it resolved or still an issue?

6

Hi, I would like more details on how to achieve this?
Is it possible for your your sticky nav to have different content to the standard nav?

7

Hey AviWhol, this tutorial might help to do the effect :smile: