I would like to know if webflow has a dropdown menu function for sub menu.
If not, anyone know how to export and add the function separately?
Will webflow have this function available soon?
1 Like
It was already said on forum, that drop-down menu will be available sooner or later. They add new things super fast so you have to wait 
1 Like
Until they add the functions, is there a way around using hover function to make a dropdown menu?
I need to present the website to my company next week and really want to continue to use webflow.
Thank you in advance!
One idea that comes to mind for a quick result is to make an image that looks like your drop-down element in its āopenedā state. Then in webflow simply make the height the size of the āun-openedā item and set the overflow to none (this way the remaining portion of the image is hidden). Next add a transition, i.e. āAll - 300ms - ease-in/ease-outā and choose the hover state and change the height to the full height of the element. Play around with float and/or z-index to have it animate without effecting other elements on the page.
You could use actual html in webflow rather than an image if you want to give links and hover effects to the menu items. Just use the same principal with the height to hide/show your menu.
Thank you so much for your input.
So are you saying I can get a dropdown menu like any other websites?
pingram3541ā¦ can you explain what you mean by using actual html in webflow?
I would really love to learn to make a drop down in webflow.
Thank you
Btw Iāll askā¦ Is it possible to make an ease-out effect? I can make only ease-in on hover, but canāt do it on out.
The last option is both ease-in and ease-out
@vinsuh - all I meant is instead of an image like this example http://dropdown.webflow.com/ (one on left) simply use webflow to build the menu in its drop down state showing all options, then set its native height only just enough to show the top item and keep overflow hidden, then on hover change the height to the full drop down (one on right).
Wowā¦ the dropdown menu on the rightā¦ that was done using webflowās tools?
Please! That is the dropdown menu I am trying to do. Can you please teach me step by step?
Your help is very much appreciated! Sorry Iām having a hard time with this.
you said āuse webflow to build the menu in its drop down state showing all optionsā ā How is that done?
Glad to help. Hereās the brick and mortar to get you going in the right direction.
- Ok, first I created the top level div block item. This is the wrapper. I chose 45px fixed height and gave it some top margin.
- I then created another div block item inside the wrapper, this is the first āsettingsā element. I chose 45px fixed height.
- I gave it a gradient background and rounded borders. I then dropped in a column block and chose 2 columns and set the ratio to 9/3 (this is the 2 sections you see)
- I then gave the left col section a 1px light right-border, the right col section a 1px right border and then aligned the text center, lastly dropped in a text block. (this is the visible top level item)
- I then gave parent div block of the 2 columns a transition easing in/out 300ms and changed the hover event styling to reverse the gradient and some of the bordersā¦this takes a lot of patience to get a good result. You can inspect my code to see how I did it.
- I then copied the parent div block of the 2 columns and pasted a few copies below changed the styling (blue gradient) and hid the right side column by giving it another class called āhiddenā and choosing display none. I also changed the hover state to a purple gradient and changed each options text to be unique, i.e. option #1, etc.
- I then went back to the wrapper div block parent (that envelopes the 5 items) (currently 45px, same as the top level item) and set its overflow to hidden so only the top level item is showing (nothing past 45px is visible). I gave it also a ease-in/out transition and for the hover state changed the height to reveal all 5 of the options (i.e. 45x5).
3 Likes
OMG sorry this is making me crazy. Iām trying so hard to follow the instructions but its not anywhere close to what you did. Is there any visual way I can learn this? Video tutorial?
You donāt know how much I want this drop down menu -_-
I know Iām asking for a lot but I really want to make things possible with webflow.
All the wrapperā¦ div blockā¦ settings are not clicking in with me. Please help once more.
You know the saying āno pain no gainā? Hereās the export of my example above. Good luck!
Yes I am trying my best right nowā¦ been trying for hours but unfortunately Iām trying to use webflow to make a site for the company i work for. If I dont have a drop down menu they will not use webflow and I really wished they did.
I donāt mind the pain but just worried I will not be able to get in done on timeā¦ leaves me 1 day from today to figure it out.
Hopefully someone can help me out here.
Thanks for the help pingram3541ā¦ I just need a little more help.
I got the menu to drop down on hoverā¦ Im just trying to figure out how to put the title on the buttons without an underline.
Also trying figure out how to have more menus aside from each other.
(just trying to create a normal top nav bar)
Hi following pingram3541 instructions I managed to make the drop down navigation.Now I am trying to make it work on mobile devices, so I added on press stateā¦the problem now is that the drop downs opens but when you release the mouse it closes.Is there any solution to keep the drop down opened?
Thanks 
Hi,
sorry for the double posts am writing in case someone has the same problem.The solution was pretty easy- I had to add both hover and press and it works perfectly.Please let me know If anybody has troubles with the drop down, and I will try to explain how I made it.Itās very easy.
1 Like
@pingram3541 brilliant explanation and thank you for sharing
1 Like
You sir are awesome! 
1 Like
You Have Photo Link or Youtube Step by step
Something try to do it can not.
Thank you
Topic is 754 days old (as of this response)ā¦ still no answer for sub-menus 
1 Like