▼
Streaming live at 10am (PST)

Can not close custom navbar on click

Design help Animations & Interactions
#1

Hello Webflow Lovers,

I have been struggling for hours with this problem. I now managed to make the navbar hide when I click on a link or when I click on “body”. However, when I try to make the navbar close on a click onto the hamburger menu the whole interaction is flawed whenever I close it via click on link or click on body.

I would want it to act like a normal navbar that one can show and close via click on the hamburger menu, and also close via click on the link or body and not have my whole interaction around ruined.

Is there anyone out there that can help me with this problem? In the read-only link you can check out my project and its interactions. I checked all the other forum entries related to this problem and did not come across a solution I could understand and implement.

Thanks in advance,
Chris

Here is my public share link: https://preview.webflow.com/preview/villa-new-site-ff127e7dd917addc0f2422d5?utm_medium=preview_link&utm_source=designer&utm_content=villa-new-site-ff127e7dd917addc0f2422d5&preview=f2d55ec8d9f9b5cf181aa3902ff4af9b&mode=preview

#2

Hey Christoph,

That’s quite the unusual nav you have on your website, which is most likely the reason other forum topics didn’t quite fit in to your specs. You can add a div block and name it Nav Closer, nest it next to div block 3. Make it be absolute and use either padding or give it an actual size in ordeer to be able to see it. After that give it an interaction that closes the navigation but don’t forget to add inside of that aniimation anotheer step which will make this nav closer display none( Use all elements with this class rather than iinteraction trigger. )After that once you are out of the inteeractions panel make that Nav Closer always diispllay none. When you do this you can select Menu Button and adjust the animation so every time it opens, it shows nav closer on top of the Meenu button. You would need to update all of thee interactions to show or hide this Nav Closer.

Webflow Experts at Flow Ninja Support Team.

1 Like
#3

Hey Uros,

thanks a bunch man. Finally managed to do this animation. I know it would have been way easier with the Webflow navbar but I so badly wanted it to open to the left. Anyways, did as you told me and it worked like magic. Love this community. <3

1 Like