Community forum for knowledge and support

Updated 2 months ago

how to make a navbar menu dropdown move upwards in webflow

At a glance

A community member is trying to figure out how to make a Navbar menu dropdown move upwards in Webflow, as the default options only allow for downward, left, or right movement. They tried using a Navbar 15 component from Relume, but noticed it also drops down on mobile. The community member is looking for a workaround, but the Webflow forum posts on this topic are outdated. Another community member suggests that modifying the native Webflow JavaScript to change the orientation of the menu trigger may be the only way to achieve the desired behavior, but this would require building the Navbar from scratch, which the original poster is not prepared to do.

Useful resources

Hi there, first time here, In short, how do I have a Navbar menu dropdown move upwards? There isn't an option within Webflow (down, left and right only). I tried having a look at Navbar 15 (https://www.relume.io/preview?cid=navbars/navbar15_component) to see how that works and noticed that, also drops down in mobile. Is there a workaround that someone could point me towards? All the Webflow forum posts about this are a bit old and I'm using Relume so thought I'd reach out here. Thanks!

M
J
7 comments

which navbar component are you trying to modify to do this?

Hi Matt, sorry for the late reply....never used Slack before either!
I'm using Navbar 14 at the moment.

On Desktop, I have basically as is and then on mobile I switched the "auto" on the fixed position from the bottom to the top so it behaves like navbar 15.

wondering if there's any way around this?

I'll be sending you a reply soon - its a bit involved. Just wanted to acknowledge this message.

ok thanks! Looking forward to it

yeah I seem to remember fighting this for hours upon hours to modify navbar 15 on a previous project and I think the conclusion I came to was that it ultimately is using native webflow javascript to determine the orientation of the menu on trigger - and the only way to modify that would be to build a navbar completely from scratch and provide your own javascript. Kind of crazy that something so simple has to be done so complicated. If you look outside of the webflow world for a vanilla JS solution that hooks into classes/IDs or use ChatGPT - you could probably get away with 90% of the heavy lifting.

ahh, that's sucks, but that's beyond what I'm prepared to do. I appreciate the effort, though!

Add a reply
Sign up and join the conversation on Slack