Header to Show only when the page is scrolled up completely

Hi everyone,

I am hoping to get some help from you as I have researched a solution to my question already extensively.

I am building a mobile travel guide and my design goal is to use the whole screen for content to be explored. Yet, when the user scrolls all the way up to the top of the page I would like him/her to discover a navigation section that sits above the top of the page and therefore hasn’t been visible to the user when he/she first landed on the page.

Is this possible?

Thanks a lot

1 Like

Hey @PatiZi

Absolutely! Can you shаре your read-only link?

Piter :webflow_heart:

Hi @PeterDimitrov,

here is the read-only link:
https://preview.webflow.com/preview/travel-guide?utm_source=travel-guide&preview=c4ee4689d9c1b8a3809096b136c87348
I tried to send you a link of the actual page in question, but could find out how.

The Page is called “Nav Bar Top”.

As you can see I managed to integrate the Top Nav Bar to come in when scrolling up. But thats not what I want.
The Nav bar should in fact not slide it, instead it should sit on top of the whole page when user is starting to scroll back up.
I should about solving this problem by link to a specific section of this page, which would be the second section with the actual content and the first section would be the nav bar. But that feels like a work around.

Hope you can help me

thanks