当我的元素未出现在屏幕中但出现在页面中时如何获得画外音焦点
How to get voiceover focus when my elements are not seen in the screen but present in the page
我有一个 HTML5 应用程序。此应用程序包含一些选项卡元素。还有一些长形。当我在画外音中轻弹时,画外音会在屏幕下方读取元素,但它们在屏幕上不可见。因此,当我双击执行操作时。什么都没发生。当一个元素在屏幕上不可见并且画外音能够读取它时,该元素就不会变得可操作。无论是文本框、复选框还是任何 select 框。我试过指定 tabindex="0"。这仅适用于复选框。但是当我有标签结构时,我无法找到其他元素的修复。
遵循此结构并解决了问题。
<ul role="tablist">
<li role="presentation"><a role="tab"></a></li>
<li role="presentation"><a role="tab"></a></li>
<li role="presentation"><a role="tab"></a></li>
<li role="presentation" class="active"><a role="tab" aria-selected="true"></a></li>
.
.
.
.
</ul>
这会使元素处于可见焦点并使其可以制表符。建议使用aria-selected和aria-control以获得更好的用户体验。
我有一个 HTML5 应用程序。此应用程序包含一些选项卡元素。还有一些长形。当我在画外音中轻弹时,画外音会在屏幕下方读取元素,但它们在屏幕上不可见。因此,当我双击执行操作时。什么都没发生。当一个元素在屏幕上不可见并且画外音能够读取它时,该元素就不会变得可操作。无论是文本框、复选框还是任何 select 框。我试过指定 tabindex="0"。这仅适用于复选框。但是当我有标签结构时,我无法找到其他元素的修复。
遵循此结构并解决了问题。
<ul role="tablist">
<li role="presentation"><a role="tab"></a></li>
<li role="presentation"><a role="tab"></a></li>
<li role="presentation"><a role="tab"></a></li>
<li role="presentation" class="active"><a role="tab" aria-selected="true"></a></li>
.
.
.
.
</ul>
这会使元素处于可见焦点并使其可以制表符。建议使用aria-selected和aria-control以获得更好的用户体验。