Nav Bar Hamburger Button to Open Full Screen

Design help General
1

Hey Guys,

I am trying to replicate this nav bar effect when opening/closing:
https://webflow.com/website/navbarhelp

I’d also need to set an X icon to close the menu.

This is my test site: https://webflow.com/website/navbarhelp

There is a scrolling I need to fix, its missing the X to close, and just wanna make sure I am doing this the right way…

Thanks so much!

2

Hi, your 2 links are the same (:

Where, on the site or within the navbar?

You can use what you want or even build your navbar from scratch. What Navabr does is setting a few things upfront for you, such as the mobile menu, the right html tag at the right place etc.

Please answer my question and edit your links and we will go forward with the X to close the navbar.

1 Like
3

Actually the trick to close a menu that webflow has built it to add a new link item, set the link to nothing or “#”, and then put a cross in it and position it absolutely in a corner. An empty link will close the panel like a normal link does.

1 Like
4

for question 1, it is on the page running at the background. maybe is not a big deal… I just noticed other websites and have the same thing.

your second answer was just what I wanted to hear. awesome! cause I only want to use a hamburger button, and was not planning to use all the other components of the nav bar, so I definitely preferred to create it myself. thanks for this clarification!!! :smiley:

As far as closing the full page menu, I tried pointing the link to # but did not work. I also tried to create an interaction, but the interaction is not working. I am sure I am doing something wrong there… what would be the right interaction to close the full page menu?

Thanks sooo much

5

@vincent I tried, but did not work like it… hmm, maybe with an interaction is better?

6

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.