html - 跳过链接在 Chrome 中不起作用

标签 html css google-chrome cross-browser accessibility

首先,我查看了 this previous question但遗憾的是它似乎没有提供任何解决方案(除了 JS,恐怕它是一个非首发者)

我的页面顶部有一些跳过链接...

<ul>
<li class="skip-link"><a href="#mainContent" accesskey="S"><span>Skip to main content</span></a></li>
<li class="skip-link"><a href="#main-navigation" accesskey="N"><span>Skip to main navigation</span></a></li>
</ul>

再往下是...

<div id="mainContent"></div>

这是一个纯粹用作 anchor 的空 div。

激活链接后一切似乎都正常;页面在视觉上向下跳转,焦点转移到#mainContent 之后的第一个链接。

但是在 Chrome (v 12.0.742.91) 中,虽然页面在视觉上向下移动,但焦点不会,这意味着在激活 accesskey 后,再次按 Tab 键只会跳回到页面顶部并返回到访问链接。

我有一个与 IE 相同的问题,归结为 a known quirk并通过为目标元素设置特定宽度来修复。但是,这似乎不适用于 Chrome。我还尝试在 #mainContent div 中添加一个可制表符的元素,在 #mainContent div 中放入任何类型的内容,以及各种 float /宽度/高度变化,但似乎没有什么可以解决的。

有没有人在使用 Chrome 时遇到过类似问题或知道解决方法?

先谢谢大家

西蒙

最佳答案

在有人找到诀窍/技巧之前,您可以做的最好的事情是主演 this issue成功了this one . 您的 SO 伙伴可能也会这样做,因为他们关心

看来,终于是fixed了.

关于html - 跳过链接在 Chrome 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6280399/

相关文章:

javascript - 溢出可见时背景颜色消失

php - 使导航栏拉伸(stretch)以适应内容

html - 使段落高度 100%

JavaScript 异步 readAsDataURL 多个文件

html - 为什么我无法在 Firefox 中将下拉列表的文本居中对齐?

css - 在 Windows 上使用多种语言和网络字体时,Chrome 换行文本

android - window.caches 在 Android Chrome 中未定义,但在桌面 Chrome 中可用

google-chrome - 如何设置 Chrome 的用户脚本版本号

html - 在哪里学习 IE6 css 问题

javascript - 将 DragScroll 添加到 slider