divi-accessibility icon indicating copy to clipboard operation
divi-accessibility copied to clipboard

SHIFT+TAB through main navigation doesn't hide the previous menu.

Open LaserLag opened this issue 4 years ago • 11 comments

Navigating backwards through main navigation with SHIFT+TAB doesn't hide the previous menu. It ends up looking like this:

shifttab

Navigating forward through the menus with TAB works fine.

LaserLag avatar Aug 13 '20 16:08 LaserLag

Hey @LaserLag thanks for the feedback!

I haven't been able to reproduce this. Is this still an issue for you? If so can you please provide a link to the site you are experiencing this on? Thank you!

josephfusco avatar Oct 30 '20 19:10 josephfusco

Hi Joseph,

This issue is still present.

Could you take another look? If you need a link, can I send it privately?

Thanks!

Divi Accessibility - Version 2.0.5 WordPress - Version: 5.8 Divi - Version: 4.9.10

Divi Accessibility - keyboard back tab menu overlap

ramseyba avatar Jul 28 '21 01:07 ramseyba

I am having the same issue. Haven's seen this behavior before. This is a multi-site configuration using a theme builder navigation menu. It is also happening on other standard WordPress sites with standard header navigation that I manage.

In development. Only plugin active is Divi Accessibility. WordPress 5.8.1, Divi 4.11.3.

URL is https://www.abatonweb.com

Also can be seen on https://usbhof.org - Standard WordPress site and navigation menu.

Happens in Chrome and MS Edge browsers

Screenshot 2021-10-19 135951

stewartsavage avatar Oct 19 '21 21:10 stewartsavage

We have the same issue when navigating backwards with Shift+Tab

joelhsmith avatar Mar 07 '22 20:03 joelhsmith

Having the same issue. Here's my little emergency fix, if anyone needs it in the meantime (it's not great, but it work):

document.addEventListener("keyup", detectTabKey);
            function detectTabKey(e) {
                if (e.keyCode == 9) {
                    activeElem = document.activeElement;
                    activeElem.parentElement.nextElementSibling && activeElem.parentElement.nextElementSibling.classList.remove("et-hover")
                }
            }

MomokoSanchez avatar Nov 27 '22 20:11 MomokoSanchez

@MomokoSanchez @joelhsmith @ramseyba @LaserLag

Found a fix for this.

BACKUP FILE BEFORE EDITING

Edit

dropdown_keyboard_navigation.min.js

found in /wp-content/plugins/divi-accessibility-master/public/partials/js

Remove

.is(":last-child")

Save

The menu will open and then close as you navigate with SHIFT+TAB

stewartsavage avatar Apr 24 '23 22:04 stewartsavage

@stewartsavage this works for the shift tabbing closing the submenus but also stops the tabbing down through the submenu links.

billigan avatar Apr 27 '23 16:04 billigan

From my experience, you could not SHIFT + TAB (navigate backwards) through submenus with the change or without. You could only navigate backwards through the parent menu items and then you would navigate forward through any submenus which are available.

This is the same behavior that I see in other themes.

Stewart Savage @.*** 530-392-8324 https://www.abatonconsulting.com

On Thu, Apr 27, 2023 at 9:20 AM William Weaver @.***> wrote:

@stewartsavage https://github.com/stewartsavage this works for the back tabbing but also stops the navigating down through the submenu items.

— Reply to this email directly, view it on GitHub https://github.com/campuspress/divi-accessibility/issues/31#issuecomment-1525988844, or unsubscribe https://github.com/notifications/unsubscribe-auth/AWEGWB5C66NWLL2DNYFEXETXDKME3ANCNFSM4P6ULIPQ . You are receiving this because you were mentioned.Message ID: @.***>

stewartsavage avatar Apr 27 '23 18:04 stewartsavage

That is what I found also. What I meant was removing that piece of the code stopped the tab down into the submenus. So I could only tab across the main menu links. The submenu dropdown would open but hitting tab just went to the next top level menu link rather than going down the submenu links.

I have a function that I was able to use in the child theme functions.php file but it is not formatting it here correctly when I try to paste it in. I'll attach it if anyone is interested. shift tab fix divi.txt

billigan avatar Apr 27 '23 19:04 billigan

I tested my changes on two different sites. Both are working as expected. However, I did have some trouble with the SiteGround optimization plugin combining javascript files. It caused the accessibility plugin to break completely.

Will give your code a try.

Thanks for sharing.

On another note, did you have any solutions for the search box not closing when SHIFT+TAB through the navigation bar? Does your code fix that too?

Stewart Savage @.*** 530-392-8324 https://www.abatonconsulting.com

On Thu, Apr 27, 2023 at 12:46 PM William Weaver @.***> wrote:

That is what I found also. What I meant was removing that piece of the code stopped the tab down into the submenus. SO I could only tab across the main menu links. The submenu dropdown would open but hitting tab just went to the next top level menu link rather than go down the submenu links.

Here is the function that I used to make it work for me.

`function ghi_shift_tab_main_menu_dropdown_close() { ?>

, or unsubscribe . You are receiving this because you were mentioned.Message ID: ***@***.***>

stewartsavage avatar Apr 28 '23 20:04 stewartsavage

You are very welcome.

I just tested the search opening and it does close with shift + tab.

billigan avatar Apr 28 '23 20:04 billigan