campuspress / divi-accessibility

Improve Divi accessibility in accordance with WCAG 2.0 guidelines.
https://wordpress.org/plugins/accessible-divi/
GNU General Public License v2.0
127 stars 29 forks source link

Tab through Divi Mega Menu closes on second column first sub-item #53

Open ramseyba opened 3 years ago

ramseyba commented 3 years ago

Tab through Divi Mega Menu, and it closes prematurely on the second column first sub-item.

If you need a link, can I send it privately?

Thanks!

Divi Accessibility - keyboard tab divi mega menu premature close

soleto commented 3 years ago

Lasts versions of Divi hide the submenu when you change the focus to another parent level that has no other submenu inside using tab key navigation.

I´m triying this but it doesn´t work. Mi knoweledge of CSS is poor. :)

.menu-item li > ul.sub-menu { display: none; } .menu-item li:hover > ul.sub-menu { display: block; } .menu-item li a:focus + ul.sub-menu { display: block; }

soleto commented 3 years ago

I solve it with this code:

li:focus-within > ul { opacity: 1; visibility: visible; } .menu-item li a:focus { display: block; }

soleto commented 3 years ago

Have you solved it?

ceswebmaster commented 2 years ago

Just want to make sure I comment on this as it's still an issue that pops up but Soleto's CSS tweak solves this and just saved me a bunch of time

soleto commented 2 years ago

Nice to hear that @ceswebmaster

christinagwira commented 1 year ago

li:focus-within > ul { opacity: 1; visibility: visible; } .menu-item li a:focus { display: block; }

This code works perfectly for my other issue #87
I'm now able to tab through using the Menu Module in the Theme Builder. Thank you!