Twenty Seventeen: Improve ARIA for the nav menu.
The `onResizeARIA()` function was not very useful and buggy. props afercia. fixes #39029, #39026 for the 4.7 branch. Built from https://develop.svn.wordpress.org/branches/4.7@39452 git-svn-id: http://core.svn.wordpress.org/branches/4.7@39392 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
parent
d344c40f57
commit
93734bcbcb
|
@ -17,8 +17,13 @@
|
|||
|
||||
container.find( '.menu-item-has-children > a, .page_item_has_children > a' ).after( dropdownToggle );
|
||||
|
||||
// Toggle buttons and submenu items with active children menu items.
|
||||
container.find( '.current-menu-ancestor > button' ).addClass( 'toggled-on' );
|
||||
// Set the active submenu dropdown toggle button initial state.
|
||||
container.find( '.current-menu-ancestor > button' )
|
||||
.addClass( 'toggled-on' )
|
||||
.attr( 'aria-expanded', 'true' )
|
||||
.find( '.screen-reader-text' )
|
||||
.text( twentyseventeenScreenReaderText.collapse );
|
||||
// Set the active submenu initial state.
|
||||
container.find( '.current-menu-ancestor > .sub-menu' ).addClass( 'toggled-on' );
|
||||
|
||||
container.find( '.dropdown-toggle' ).click( function( e ) {
|
||||
|
@ -50,15 +55,13 @@
|
|||
return;
|
||||
}
|
||||
|
||||
// Add an initial values for the attribute.
|
||||
menuToggle.add( siteNavigation ).attr( 'aria-expanded', 'false' );
|
||||
// Add an initial value for the attribute.
|
||||
menuToggle.attr( 'aria-expanded', 'false' );
|
||||
|
||||
menuToggle.on( 'click.twentyseventeen', function() {
|
||||
$( siteNavContain ).toggleClass( 'toggled-on' );
|
||||
siteNavContain.toggleClass( 'toggled-on' );
|
||||
|
||||
$( this )
|
||||
.add( siteNavigation )
|
||||
.attr( 'aria-expanded', $( this ).add( siteNavigation ).attr( 'aria-expanded' ) === 'false' ? 'true' : 'false' );
|
||||
$( this ).attr( 'aria-expanded', siteNavContain.hasClass( 'toggled-on' ) );
|
||||
});
|
||||
})();
|
||||
|
||||
|
@ -103,32 +106,4 @@
|
|||
$( this ).parents( '.menu-item, .page_item' ).toggleClass( 'focus' );
|
||||
});
|
||||
})();
|
||||
|
||||
// Add the default ARIA attributes for the menu toggle and the navigations.
|
||||
function onResizeARIA() {
|
||||
if ( 'block' === $( '.menu-toggle' ).css( 'display' ) ) {
|
||||
|
||||
if ( menuToggle.hasClass( 'toggled-on' ) ) {
|
||||
menuToggle.attr( 'aria-expanded', 'true' );
|
||||
} else {
|
||||
menuToggle.attr( 'aria-expanded', 'false' );
|
||||
}
|
||||
|
||||
if ( siteNavigation.closest( '.main-navigation' ).hasClass( 'toggled-on' ) ) {
|
||||
siteNavigation.attr( 'aria-expanded', 'true' );
|
||||
} else {
|
||||
siteNavigation.attr( 'aria-expanded', 'false' );
|
||||
}
|
||||
} else {
|
||||
menuToggle.removeAttr( 'aria-expanded' );
|
||||
siteNavigation.removeAttr( 'aria-expanded' );
|
||||
menuToggle.removeAttr( 'aria-controls' );
|
||||
}
|
||||
}
|
||||
|
||||
$( document ).ready( function() {
|
||||
$( window ).on( 'load.twentyseventeen', onResizeARIA );
|
||||
$( window ).on( 'resize.twentyseventeen', onResizeARIA );
|
||||
});
|
||||
|
||||
})( jQuery );
|
||||
|
|
|
@ -4,7 +4,7 @@
|
|||
*
|
||||
* @global string $wp_version
|
||||
*/
|
||||
$wp_version = '4.7-RC1-39448';
|
||||
$wp_version = '4.7-RC1-39452';
|
||||
|
||||
/**
|
||||
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.
|
||||
|
|
Loading…
Reference in New Issue