Question

在我正在研究的网站上，我们有1）移动头2）桌面头。两者都已加载，但是图像是延迟加载的+一些桌面内容。

我们正在努力使盲人可以访问该网站，我正在Mac上使用VoiceOver进行测试。

当我测试时，无论我做什么，似乎都想阅读移动菜单。

<div aria-hidden="true" hidden style="display: none; visibility: hidden;">
    <nav aria-hidden="true">
        <div>
            <div class="react-hamburger-menu" aria-hidden="true">
                <!-- ... -->
            </div>
        </div>
    </nav>
</div>

我们需要渲染这两者，因为在大型平板电脑上，它将是纵向模式下的移动标题和横向模式下的桌面标题。

我找不到其他让它停止阅读的内容。它将这个最深的孩子仍然读为一个按钮，然后继续阅读整个移动菜单（在我阅读了整个台式机版本之后）

编辑：我正在使用Mac OS High Sierra 10.13.6。

Answer 1

Seems like I had missed some elements that were moved using React Portal, also VoiceOver seems to not read only display: block; visibility: hidden; elements, and not really care much about aria-hidden="true"

VoiceOver读取隐藏的元素

1 个答案: