Question

Drop-down lists, menus and combo boxes are all very common user interface elements. Users are accustomed to seeing these elements in native applications and sometimes web apps, but there are a few problems with them.

  1. You have to aim the mouse. Some menus collapse when you mouse out, and some have submenus that you have to aim at to expand.

  2. You can't see the options without aiming the mouse first.

These are the main things that trouble me, maybe other people notice other issues as well. I normally don't use drop-down menus at all if I can help it.

The problem is that I sometimes want to present a long list of options in limited space. Issue 2 is a sacrifice I'm willing to make, but I'm wanting to know if anyone has any tricks to make these drop menus easier to use. Maybe someone has invented a new style of list control.

I'm sure that if these types of controls annoy me, then they annoy users of my site more.

Was it helpful?

Solution

You could try something like Mac OS/X has for its taskbar, similar to the selection bar in YouTube. I think the common term is a bubble bar where small images animate larger as the mouse rolls over them, but shrink back down to such a size that all items are visible when the mouse is not over the control.

OTHER TIPS

Hmm..one more thing which annoys me about the dropdown list is the inability to control their width as it expands with the text (or is their something which I am unaware of ?).

For an alternate, I think about a little popup which initially displays a list of available options in form of Alphabetic index and when the user clicks on an alphabet link, it displays the relevant options to select from. This will reduce the options to select from.

On the same terms, we can use ajax to build the options on the fly as user types in.

@Nrj width='20px' will keep the collapsed drop down at a width of 20px. Problem is, Inernet Explorer shows the expanded item with this width also, while all other browsers i met so far will show you the full menu.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top