WordPress 4.0.1

[autoinstalls/wordpress.git] / wp-content / themes / twentytwelve / js / navigation.js

diff --git a/wp-content/themes/twentytwelve/js/navigation.js b/wp-content/themes/twentytwelve/js/navigation.js
index 915e25a91de8e94f169ff17d7897a22eb180fa40..34a640246e817c2f61d9605e6ba6366a11dba62a 100644 (file)
--- a/wp-content/themes/twentytwelve/js/navigation.js
+++ b/wp-content/themes/twentytwelve/js/navigation.js
@@ -1,16 +1,18 @@
 /**
- * navigation.js
- *
- * Handles toggling the navigation menu for small screens.
+ * Handles toggling the navigation menu for small screens and
+ * accessibility for submenu items.
  */
 ( function() {
        var nav = document.getElementById( 'site-navigation' ), button, menu;
-       if ( ! nav )
+       if ( ! nav ) {
                return;
-       button = nav.getElementsByTagName( 'h3' )[0];
+       }
+
+       button = nav.getElementsByTagName( 'button' )[0];
        menu   = nav.getElementsByTagName( 'ul' )[0];
-       if ( ! button )
+       if ( ! button ) {
                return;
+       }
 
        // Hide button if menu is missing or empty.
        if ( ! menu || ! menu.childNodes.length ) {
@@ -19,10 +21,11 @@
        }
 
        button.onclick = function() {
-               if ( -1 == menu.className.indexOf( 'nav-menu' ) )
+               if ( -1 === menu.className.indexOf( 'nav-menu' ) ) {
                        menu.className = 'nav-menu';
+               }
 
-               if ( -1 != button.className.indexOf( 'toggled-on' ) ) {
+               if ( -1 !== button.className.indexOf( 'toggled-on' ) ) {
                        button.className = button.className.replace( ' toggled-on', '' );
                        menu.className = menu.className.replace( ' toggled-on', '' );
                } else {
@@ -30,4 +33,23 @@
                        menu.className += ' toggled-on';
                }
        };
-} )();
\ No newline at end of file
+} )();
+
+// Better focus for hidden submenu items for accessibility.
+( function( $ ) {
+       $( '.main-navigation' ).find( 'a' ).on( 'focus.twentytwelve blur.twentytwelve', function() {
+               $( this ).parents( '.menu-item, .page_item' ).toggleClass( 'focus' );
+       } );
+
+  if ( 'ontouchstart' in window ) {
+    $( '.menu-item-has-children > a' ).on( 'touchstart.twentytwelve', function( e ) {
+      var el = $( this ).parent( 'li' );
+
+      if ( ! el.hasClass( 'focus' ) ) {
+        e.preventDefault();
+        el.toggleClass( 'focus' );
+        el.siblings( '.focus').removeClass( 'focus' );
+      }
+    } );
+  }
+} )( jQuery );