Ticket #21562: 21562.4.diff

wp-content/themes/twentytwelve/style.css

@@ -534 +534 @@
 .main-navigation .menu {
         display: none;
 }
+.main-navigation .menu.toggled-on,
 .menu-toggle {
         display: inline-block;
 }
@@ -1548 +1549 @@
         .site-content nav,
         .widget-area,
         img.header-image,
-        nav.site-navigation {
+        .main-navigation {
                 display: none;
         }
         .wrapper {

wp-content/themes/twentytwelve/js/navigation.js

@@ -3 +3 @@
  *
  * Handles toggling the navigation menu for small screens.
  */
+( function() {
+        var button = document.getElementById( 'site-navigation' ).getElementsByTagName( 'h3' )[0],
+                menu   = document.getElementById( 'site-navigation' ).getElementsByTagName( 'ul' )[0];
 
-jQuery( document ).ready( function( $ ) {
-        if ( ! $( '#masthead .menu' ).children().length ) {
-                $( '#masthead .menu-toggle' ).hide();
-        }
-
-        $( '.menu-toggle' ).off( 'click' ).click( function() {
-                $( '#masthead .menu' ).stop().slideToggle();
-                $( this ).toggleClass( 'toggled-on' );
-        } );
-} );
- No newline at end of file
+        button.onclick = function() {
+                if ( button.className.match( new RegExp( '(\\s|^)toggled-on(\\s|$)' ) ) ) {
+                        button.className = 'menu-toggle';
+                        menu.className = 'menu';
+                } else {
+                        button.className= 'menu-toggle toggled-on';
+                        menu.className = 'menu toggled-on';
+                }
+        };
+} )();
+ No newline at end of file

wp-content/themes/twentytwelve/header.php

@@ -35 +35 @@
                         <h2 class="site-description"><?php bloginfo( 'description' ); ?></h2>
                 </hgroup>
 
-                <nav class="site-navigation main-navigation" role="navigation">
+                <nav id="site-navigation" class="main-navigation" role="navigation">
                         <h3 class="menu-toggle"><?php _e( 'Show menu', 'twentytwelve' ); ?></h3>
                         <div class="skip-link assistive-text"><a href="#content" title="<?php esc_attr_e( 'Skip to content', 'twentytwelve' ); ?>"><?php _e( 'Skip to content', 'twentytwelve' ); ?></a></div>
                         <?php wp_nav_menu( array( 'theme_location' => 'primary' ) ); ?>