Sidebar Navigation: Level 2 Usability Improvement
Opened this issue · 0 comments
We're not the first to have this issue.
When navigating to level 2 items in the sidebar, the flyout unexpecedly closes when the user tries to move the cursor to the desired level 2 menu item.
On the direct path to the item the cursors leaves the hover area of the main item, which makes the flyout disappear.
We've been affirmed that most users ran into the problem at first and have to learn how to avoid this issue.
Screen.Recording.2023-12-12.at.15.25.08.mov
We're also not the first to solve this. Here's an article coming up with different solutions.
https://css-tricks.com/dropdown-menus-with-more-forgiving-mouse-movement-paths/
This article describes, how amazon solved this issue. (See heading "How did Amazon get away without using a delay?")
https://bjk5.com/post/44698559168/breaking-down-amazons-mega-dropdown