adobe-accessibility / Accessible-Mega-Menu

A demonstration of how to implement a keyboard and screen reader accessible mega menu as a jQuery plugin.
Apache License 2.0
605 stars 199 forks source link

Specific document structure required #20

Open bryanburgers opened 10 years ago

bryanburgers commented 10 years ago

The structure of my navigation has an extra element between the nav and the ul, and so breaks Accessible Mega Menu.

<nav>
  <div class="container">
    <ul class="navigationroot">
...
    </ul>
  </div>
</nav>

Potential options to fix this:

  1. At Line 708, use nav.find('.' + settings.menuClass').first() instead of nav.children().first(). This would require that the menu class exists already, though.
  2. Allow some sort of menuSelector option, and then at Line 708, use nav.find(settings.menuSelector).first().
pianomister commented 8 years ago

I would also like to see a change like this. When first playing around with this jQuery plugin, I actually expected that the classes given as parameters are used within jQuery selectors to identify the items to be used - not to actually SET them using jQuery.

Another issue that would be solved when using the classes to select/find items: I have a top level navigation where not every item has a mega menu dropdown. Some top level items are just links. The current plugin initialization appends the dropdown menu class to the actual link item, which breaks the navigation in some cases (in my case, responsive design with hidden navigation on small screen).