| Index: trunk/phase3/resources/jquery/jquery.mw-jump.js |
| — | — | @@ -0,0 +1,15 @@ |
| | 2 | +/** |
| | 3 | + * JavaScript to show jump links to motor-impaired users when they are focused. |
| | 4 | + */ |
| | 5 | +jQuery( function( $ ) { |
| | 6 | + |
| | 7 | + $('.mw-jump').delegate( 'a', 'focus blur', function( e ) { |
| | 8 | + // Confusingly jQuery leaves e.type as "focusout" for delegated blur events |
| | 9 | + if ( e.type === "blur" || e.type === "focusout" ) { |
| | 10 | + $( this ).closest( '.mw-jump' ).css({ height: '0' }); |
| | 11 | + } else { |
| | 12 | + $( this ).closest( '.mw-jump' ).css({ height: 'auto' }); |
| | 13 | + } |
| | 14 | + } ); |
| | 15 | + |
| | 16 | +} ); |
| Property changes on: trunk/phase3/resources/jquery/jquery.mw-jump.js |
| ___________________________________________________________________ |
| Added: svn:eol-style |
| 1 | 17 | + native |
| Index: trunk/phase3/resources/Resources.php |
| — | — | @@ -158,6 +158,9 @@ |
| 159 | 159 | 'jquery.mwExtension' => array( |
| 160 | 160 | 'scripts' => 'resources/jquery/jquery.mwExtension.js', |
| 161 | 161 | ), |
| | 162 | + 'jquery.mw-jump' => array( |
| | 163 | + 'scripts' => 'resources/jquery/jquery.mw-jump.js', |
| | 164 | + ), |
| 162 | 165 | 'jquery.qunit' => array( |
| 163 | 166 | 'scripts' => 'resources/jquery/jquery.qunit.js', |
| 164 | 167 | 'styles' => 'resources/jquery/jquery.qunit.css', |
| — | — | @@ -610,6 +613,7 @@ |
| 611 | 614 | 'jquery.checkboxShiftClick', |
| 612 | 615 | 'jquery.makeCollapsible', |
| 613 | 616 | 'jquery.placeholder', |
| | 617 | + 'jquery.mw-jump', |
| 614 | 618 | 'mediawiki.util', |
| 615 | 619 | ), |
| 616 | 620 | ), |
| Index: trunk/phase3/skins/common/commonPrint.css |
| — | — | @@ -114,6 +114,7 @@ |
| 115 | 115 | |
| 116 | 116 | .noprint, |
| 117 | 117 | div#jump-to-nav, |
| | 118 | +.mw-jump, |
| 118 | 119 | div.top, |
| 119 | 120 | div#column-one, |
| 120 | 121 | #colophon, |
| Index: trunk/phase3/skins/common/shared.css |
| — | — | @@ -1006,3 +1006,11 @@ |
| 1007 | 1007 | #mw-credits a { |
| 1008 | 1008 | unicode-bidi: embed; |
| 1009 | 1009 | } |
| | 1010 | + |
| | 1011 | +/* Accessibility */ |
| | 1012 | +.mw-jump { |
| | 1013 | + overflow: hidden; |
| | 1014 | + height: 0; |
| | 1015 | + zoom: 1; /* http://webaim.org/techniques/skipnav/#iequirk */ |
| | 1016 | +} |
| | 1017 | + |
| Index: trunk/phase3/skins/common/commonInterface.css |
| — | — | @@ -46,7 +46,9 @@ |
| 47 | 47 | display: none; |
| 48 | 48 | } |
| 49 | 49 | #jump-to-nav { |
| 50 | | - display: none; |
| | 50 | + /* Negate #contentSub's margin and replicate it so that the jump to links don't affect the spacing */ |
| | 51 | + margin-top: -1.4em; |
| | 52 | + margin-bottom: 1.4em |
| 51 | 53 | } |
| 52 | 54 | #contentSub, #contentSub2 { |
| 53 | 55 | font-size: 84%; |
| Index: trunk/phase3/skins/Vector.php |
| — | — | @@ -158,7 +158,7 @@ |
| 159 | 159 | <?php endif; ?> |
| 160 | 160 | <?php if ( $this->data['showjumplinks'] ): ?> |
| 161 | 161 | <!-- jumpto --> |
| 162 | | - <div id="jump-to-nav"> |
| | 162 | + <div id="jump-to-nav" class="mw-jump"> |
| 163 | 163 | <?php $this->msg( 'jumpto' ) ?> <a href="#mw-head"><?php $this->msg( 'jumptonavigation' ) ?></a>, |
| 164 | 164 | <a href="#p-search"><?php $this->msg( 'jumptosearch' ) ?></a> |
| 165 | 165 | </div> |
| Index: trunk/phase3/skins/MonoBook.php |
| — | — | @@ -80,7 +80,7 @@ |
| 81 | 81 | <?php } ?><?php if($this->data['newtalk'] ) { ?> |
| 82 | 82 | <div class="usermessage"><?php $this->html('newtalk') ?></div> |
| 83 | 83 | <?php } ?><?php if($this->data['showjumplinks']) { ?> |
| 84 | | - <div id="jump-to-nav"><?php $this->msg('jumpto') ?> <a href="#column-one"><?php $this->msg('jumptonavigation') ?></a>, <a href="#searchInput"><?php $this->msg('jumptosearch') ?></a></div> |
| | 84 | + <div id="jump-to-nav" class="mw-jump"><?php $this->msg('jumpto') ?> <a href="#column-one"><?php $this->msg('jumptonavigation') ?></a>, <a href="#searchInput"><?php $this->msg('jumptosearch') ?></a></div> |
| 85 | 85 | <?php } ?> |
| 86 | 86 | <!-- start content --> |
| 87 | 87 | <?php $this->html('bodytext') ?> |