Read Damon Muma on this. He proposes the following jQuery solution (inspired by Thompson, fixed by me):
// Apply focus properly when accessing internal links with keyboard in WebKit browsers.
$("a[href^='#']").not("a[href='#']").click(function() {
$("#"+$(this).attr("href").slice(1)+"").focus();
});
I don’t like to use jQuery however for things that should be seen as required code for any website. Below I include my own JavaScript port, including some error checking and more complete HREF
support.
- Pilot version. (d385d2)
tabindex
now using-1
instead of0
, as per Smith, added this README, and added UNLICENCE. (c194df)- Updates to the README. (prev. 0fce31) (prev. a31368) (7d175b)
- Added a clause to check for pre-existing
tabindex
values. (a39c9b) - Added support for named anchors. The
name
attribute is obsolete and is only checked for backwards compatibility. (0ab22c) - No more errors on empty fragments (
#
) or undefined elements (#thisIDisnotused
). (9ebb30) - Added support for URLs not starting with
#
but starting with the current page’s location. Also updated the README with a list of tested browsers. (8adf2a) - Shaved off some bytes and added a compressed version. (116262)
- Updated the README, it is no longer just a quick port. (924088)
- Even smaller. (prev. f6cf48) (aeb909)
- Fix for pages using a
BASE
element. As reported by Gartner. (prev. b8648a) (341fdf) - Stop overwriting existing
onClick
events. (376b75) - Inspired by Duffy’s take on things it now uses
addEventListener
instead ofonClick
to avoid event clashes, and the completelocation
value instead of a virtualA
-element. Also fine-tuned it to not apply to too many wrong links and shortened the code some more. (05bff0) - Current: Saving 6 more bytes on skiplinks.min.js via Google’s Closure Compiler Service. (prev. e0ca59)
- Firefox 10.0.2
- Chrome 17.0.963.56
- Safari 5.0.6 (5533.22.3)
Hi! Would it be possible to extend this method so that links followed from the longdesc attribute or the cite attribute would also change focus? For a Webkit browser that allows you to open @longdesc URLs and @cite URLs, see iCab. http://www.icab.de Longdesc attribute URLs and cite attribute URL are, in iCab, opened via a contextual menu. I have a test page here: http://malform.no/testing/a-demo-of/longdesc-with-hidden-iframe/