TheDJ has uploaded a new change for review.

  https://gerrit.wikimedia.org/r/80799


Change subject: Accessibility: Make jump links work in Safari and Chrome
......................................................................

Accessibility: Make jump links work in Safari and Chrome

Use Javascript to focus the first tabbable element starting from the
target that we jump to.

When navigating to an ID, focus only follows if the target is a
focusable element (has implicit or explicit tabindex). When navigating
to an unfocusable element, the position of focus becomes undefined.
Webkit (safari/chrome) keep it on the element that had the focus, IE
and Firefox unfocus and on the next tab will select the first tabbable
element starting from the target.

Change-Id: If1f7f578cc9b1fad7d40d168dc225287a36638fe
---
M resources/jquery/jquery.mw-jump.js
1 file changed, 8 insertions(+), 2 deletions(-)


  git pull ssh://gerrit.wikimedia.org:29418/mediawiki/core 
refs/changes/99/80799/1

diff --git a/resources/jquery/jquery.mw-jump.js 
b/resources/jquery/jquery.mw-jump.js
index e286834..ac3671c 100644
--- a/resources/jquery/jquery.mw-jump.js
+++ b/resources/jquery/jquery.mw-jump.js
@@ -3,9 +3,15 @@
  */
 jQuery( function ( $ ) {
 
-       $( '.mw-jump' ).on( 'focus blur', 'a', function ( e ) {
+       $( '.mw-jump' ).on( 'focus blur keypress', 'a', function ( e ) {
                // Confusingly jQuery leaves e.type as focusout for delegated 
blur events
-               if ( e.type === 'blur' || e.type === 'focusout' ) {
+               if ( e.type === 'keypress' ) {
+                       if ( e.keyCode === 14 ) {
+                               var $dest = $( $( this ).attr( 'href' ) );
+                               $dest.find( ':tabbable:first' ).focus();
+                               e.preventDefault();
+                       }
+               } else if ( e.type === 'blur' || e.type === 'focusout' ) {
                        $( this ).closest( '.mw-jump' ).css({ height: 0 });
                } else {
                        $( this ).closest( '.mw-jump' ).css({ height: 'auto' });

-- 
To view, visit https://gerrit.wikimedia.org/r/80799
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings

Gerrit-MessageType: newchange
Gerrit-Change-Id: If1f7f578cc9b1fad7d40d168dc225287a36638fe
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/core
Gerrit-Branch: master
Gerrit-Owner: TheDJ <hartman.w...@gmail.com>

_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits

Reply via email to