[Patternfly] Suggestion: Error-tolerant nested dropdowns

Robb Hamilton rhamilto at redhat.com
Mon Jul 6 13:23:44 UTC 2015


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 at 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 at 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 at redhat.com
>> https://www.redhat.com/mailman/listinfo/patternfly
>>
>
>
> _______________________________________________
> Patternfly mailing list
> Patternfly at redhat.com
> https://www.redhat.com/mailman/listinfo/patternfly
>
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://listman.redhat.com/archives/patternfly/attachments/20150706/d773badd/attachment.htm>


More information about the PatternFly mailing list