OnPoint Plugins

← Back to support

Accordion Accessibility

Resolved

Requested: 4 months and 3 weeks ago

On the menu, I need to make it keyboard accessible. So user can tab through it. First issue is the dropdown arrows cannot receive focus or have aria-labels. I tried using jquery to fix this but cannot add a tabindex attribute to the span tag. Looks like this can be done via the code but I do not want to make direct changes to the plugin (Styles.php, starting at line 286ish).

Next issue would be to make the menu expand either on focus of the dropdown indicator or onfocus and enter key.

Please let me know if there is a way to do this via your filters or a possible plugin update.

  1. Hi Teranecia,

    I met with the team and was able to make accordion accessibly part of the next release. Version 3.12.0 of PRO will be available some time next week.

    Among other improvements, this version will include:

    1. tabindex attributes on all accordion icons.
    2. aria-expanded attributes on all accordion icons.
    3. aria-hidden attributes on all sub menus which may be opened or closed via accordion icons.
    4. Ability to open/close menus by clicking “Enter” when focused on an accordion icon.
    5. Styles to prevent outlines when clicking accordion icons via the mouse.
    6. Auto focusing of accordion icons on click or enter.

    This should take care of your requested requirements.

    Have a great weekend!

    Mat Lipe

Respond