[Date Prev][Date Next]   [Thread Prev][Thread Next]   [Thread Index] [Date Index] [Author Index]

Re: [Patternfly] Suggestion: Error-tolerant nested dropdowns



I’ve used https://github.com/kamens/jQuery-menu-aim (mentioned in the CSS tricks articel) to account for this issue on other sites.  It works well.  

Note:  Bootstrap did away with submenus in dropdowns, but PatternFly supports them as the initial implementation of the PatternFly navbar did, so we needed to maintain backward compatibility.

On Thu, Jul 2, 2015 at 1:26 PM, Andres Galante <agalante redhat com> wrote:
This is interesting. Our navigation bar dropmenu open on click and they don't close until you click outside them

https://rawgit.com/andresgalante/patternfly/master/tests/navbar.html#

However submenus opens on hover and we could use the error-tolerance.

If anyone has a real use case for this I can generate a simple js snippet to test it.




On Thu, Jul 2, 2015 at 1:23 PM, Ron Smeral <rsmeral redhat com> wrote:
Hi all,

I've recently stumbled upon this UX improvement of nested dropdowns: introduce tolerance to opening of nested dropdowns. E.g. Google Chrome (using delay) or Amazon (using clever maths) implement this.

Best explained visually, e.g. here:
https://css-tricks.com/dropdown-menus-with-more-forgiving-mouse-movement-paths/

Or in words:
Traditionally (without tolerance), to select an item in a nested dropdown, the user needs to go through a narrow single-item-wide corridor to arrive at the first item of the nested dropdown and then select another item in there - rectangular path, two movements.
With tolerance, the user can make a direct path between the current item and a nested item, even crossing other main dropdown items, which in the traditional model, would hide the nested dropdown.

Formally, this improvement follows the Fitt's law by decreasing the distance and increasing the target size.

Do you think it would make sense to suggest this as part of the guidelines?


Thanks.

Ron

--
Ron Smeral
Technical Writer, FeedHenry
Red Hat
Brno

_______________________________________________
Patternfly mailing list
Patternfly redhat com
https://www.redhat.com/mailman/listinfo/patternfly


_______________________________________________
Patternfly mailing list
Patternfly redhat com
https://www.redhat.com/mailman/listinfo/patternfly



[Date Prev][Date Next]   [Thread Prev][Thread Next]   [Thread Index] [Date Index] [Author Index]