html taborder 快捷键,html - Web Accessibility - Tab Order? - Stack Overflow

最新推荐文章于 2021-06-08 21:05:48 发布

东东嘿

最新推荐文章于 2021-06-08 21:05:48 发布

阅读量105

点赞数

文章标签： html taborder 快捷键

本文探讨了视觉上隐藏但仍需键盘操作的菜单问题，强调了CSS调整和元素转换的重要性，确保对键盘用户和屏幕阅读器的无障碍体验。建议更新CSS隐藏显示逻辑，并将导航按钮改为实际焦点元素。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

The problem you're having isn't a tabindex issue, as the tabindex is correct for the menu's position in the DOM. (also changing tabindexes to values beyond 0 or -1 can really screw up the expected tab order for an interface).

What is going on here is that the menu has been visually hidden, by positioning it off screen, but it has not been adequately hidden from keyboard users/screen readers.

You'll need to update the CSS of your menu, so that when it is positioned off screen, the id="slider-menu-nav-list" is set to display: none. Then when the menu button is activated, the #slider-menu-nav-list should be set to display: block;

Looking through the source code some more, you'll also have to change your Menu button into an actual element, as it's currently keyboard inaccessible as a

combo, so there is currently no way for a keyboard users to actually open the menu. (not all keyboard users are blind, and it can be frustrating to not be able to see where your current keyboard focus is located).

Hope this helps!