7

I'm currently working on a design that originally was using a nested drop down meny like so: enter image description here

But, when a user clicks on the "more" icon of the card furthest to the right, the drop down menu no longer fits on the screen. enter image description here

Is there a better way of handling this? We thought we might do something like how chrome has created their bookmarks menu. Below are some images that illustrate what happens. Basically, the original menu is replaced by the submenu, and we add a back button. Is there a name for this pattern/type of nested menu? Does anyone know an existing library that supports this?

Or, does someone know of a better alternative? It'd be great if there was a library we could use for it.

enter image description here

enter image description here

enter image description here

Any advice would help! Thank you!!

  • Personally I like your last option, where the nested menu replaces the parent menu and has an option to go up the hierarchy. – kontur May 30 '15 at 11:46
4

Windows handles this by showing the dropdown menu on the other side, if the menu wouldn't fit.

1

I would suggest either going the route you're proposing or you could make the navigation a sort of accordion style navigation.

Here's a jQuery plugin for what I'm talking about. Their demo is much more robust than you need but as long as your secondary navigation didn't get too long it doesn't seem as if it'd scroll down off your page by looking at your screenshots. The benefit here is that the user would always see the options.

http://apps.komposta.net/jquery/navgoco/demo/

Here's a plugin to help with your proposal. It's for a menu on the side, but I suspect with a little tinkering you could bend it to your will to add the same functionality within your dropdown.

http://mmenu.frebsite.nl/

I honestly don't know if there's one specific name for these styles of navigation. You're trying to navigate within a small area so I would look for mobile navigation options. I did that and came across Brad Frost's page for the two solutions I listed here.

  • 1
    Thanks! Super Helpful! We're going to see if we can make mmenu work for us. – mlveg Jun 2 '15 at 16:38

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.