fly-out menu usability problem
I think every web-based fly-out menu that I've used has the problem that it expects people's mouse skills to be accurate.
Consider a menu system that has 3 levels. Each item in Level 1 and Level 2 causes fly-out sub menus. The use expects this, and such will get used to moving the mouse to the right in order to use those menus. As they mouseover one of the Level 2 menuitems the Level 3 menus will appear, and as such they might try to move their mouse to the third level.
I found this fly-out menu on a CSS site, but it operates in the same way as most. Click here to open it up. It uses the :hover psuedo event in CSS (and a hack to make it work in IE using javascript events).
The issue is that people will try to anticipate the menu item they want to get to - in the image above it's "adipiscing > dolor > ipsum", and their mouse may not follow the required angular (red) path that is needed and accidentally mouse over a different menu item (green) that would also cause a fly-out menu (e.g. "vestibulum", in the image above) to appear. This then causes them to pause, re-position the mouse pointer to hide the wrongly opened submenu, and then wait for the correct submenu to appear (as shown in the path below). In complex menu systems this becomes a major annoyance because it requires relatively exact mouse positioning skills on part ot the operator.
Has any one seen a good solution that allows curved mouse paths that temporarily cross event boundaries for fly out menus? The problem with :hover psuedoclasses is that the event fires independantly of any control via script, so a scripting solution would have to be the go. Started By frumbert on Jan 15, 2007 at 5:55:35 PM |