Menu icon Foundation
Drop Down Button with Branching Sub-menus?

I'm currently building a web application where there may be many items on a page that all have an "actions" button menu next to each item. As I'm adding more functionality, this actions menu is getting longer. I'd like to be able to have a drop down button menu branch out into submenus much like the top bar does with "has-dropdown".

If I attempt to use the top bar's "has-dropdown" markup in a drop down button, it doesn't create the submenu effect it simply displays the ul items inline with the parent.

Has anyone cracked this and gotten it to work? I can't be the only one who wishes drop down buttons would offer branching sub menus.

drop downbuttonmenufeature request

I'm currently building a web application where there may be many items on a page that all have an "actions" button menu next to each item. As I'm adding more functionality, this actions menu is getting longer. I'd like to be able to have a drop down button menu branch out into submenus much like the top bar does with "has-dropdown".

If I attempt to use the top bar's "has-dropdown" markup in a drop down button, it doesn't create the submenu effect it simply displays the ul items inline with the parent.

Has anyone cracked this and gotten it to work? I can't be the only one who wishes drop down buttons would offer branching sub menus.

Christopher Raymond about 5 years ago

Unfortunately that uses a top bar element to accomplish it. I've messed with that and it doesn't work for me as my drop down menu buttons live within a table cell.

However I did manage to accomplish what I'm looking for using a drop down button within my drop down menu and applied a little javascript to hack it together. That said, it would be nice if Foundation would support branching drop down menu buttons out of the box.

I will still have to work on small screen presentation for my code, but overall it's working well enough for me so far.

Rafi Benkual about 5 years ago