Streaming live at 10am (PST)

Scroll interaction on navbar


#1

Hello im having an issue with my navbar.

I wanted to create this effect on my site:

https://preview.webflow.com/preview/lzstudio?preview=7e98402c506e4a0428aca134fada9ac1

The fixed navbar only shows when going down and disappears when going up. That’s ok I put interaction page scrolled into the navbar and insert the values on “when scroll up” and “when scroll down” and it worked. The problema is that this is assuming in all page. For example when I’m on the bottom of the page and i scroll up the navbar disappears. I want it to disappear only on the hero section.
What can i do? I wanted to do like on this link i found: https://preview.webflow.com/preview/lzstudio?preview=7e98402c506e4a0428aca134fada9ac1

I actually tried the interaction “when page is scrolling” and it worked, but i did’nt like the effect because its using keyframes.

Here is my read only link:

https://preview.webflow.com/preview/coliseu-micaelense?preview=7d074afbba67b5c07fea91fab9144c46

Thanks!


#2

Hey Helena,

I’m only a modest community manager so I’m not sure how to help :wink:, but thought maybe @Livia_Zhang could help you out since she was the one who built that example you’re referring to!

PS: little tip, it’d be nice if you can add a profile picture! It’s always nicer when you know who you’re talking to!


#3

Hey Helena, basically i had two nav bars and show/hide them according to body’s position and hero section’s position. For more details please checkout body & hero section’s legacy interactions. Since it is hard to describe in words, i also created a cloneable project https://webflow.com/website/Cloneable-Navbar-for-Helena?s=lzstudio-navbar for you. Clone it and play with it a bit :slight_smile: