WordPress.org

Make WordPress Core

Ticket #21562: 21562.9.diff

File 21562.9.diff, 5.1 KB (added by lancewillett, 20 months ago)

Adds JS check for undefined menu and button elements

  • wp-content/themes/twentytwelve/style.css

     
    513513        margin-top: 1.714285714rem; 
    514514        text-align: center; 
    515515} 
    516 .main-navigation li ul ul { 
    517         margin-left: 40px; 
    518         margin-left: 2.857142857rem; 
    519 } 
    520516.main-navigation li { 
    521517        margin-top: 24px; 
    522518        margin-top: 1.714285714rem; 
     
    531527.main-navigation a:hover { 
    532528        color: #21759b; 
    533529} 
    534 .main-navigation .menu { 
     530.main-navigation ul.nav-menu, 
     531.main-navigation div.nav-menu > ul { 
    535532        display: none; 
    536533} 
     534.main-navigation ul.nav-menu.toggled-on, 
    537535.menu-toggle { 
    538536        display: inline-block; 
    539537} 
     
    13401338                font-size: 1.857142857rem; 
    13411339                line-height: 1.846153846; 
    13421340        } 
    1343         .main-navigation .menu { 
     1341        .main-navigation ul.nav-menu, 
     1342        .main-navigation div.nav-menu > ul { 
    13441343                border-bottom: 1px solid #ededed; 
    13451344                border-top: 1px solid #ededed; 
    13461345                display: inline-block !important; 
     
    13531352                margin: 0; 
    13541353                text-indent: 0; 
    13551354        } 
    1356         .main-navigation li ul li { 
    1357                 padding-left: 0; 
    1358         } 
    13591355        .main-navigation li a, 
    13601356        .main-navigation li { 
    13611357                display: inline-block; 
    13621358                text-decoration: none; 
    13631359        } 
    13641360        .main-navigation li a { 
     1361                border-bottom: 0; 
    13651362                color: #6a6a6a; 
     1363                line-height: 3.692307692; 
    13661364                text-transform: uppercase; 
    13671365        } 
    13681366        .main-navigation li a:hover { 
     
    13731371                margin: 0 2.857142857rem 0 0; 
    13741372                position: relative; 
    13751373        } 
    1376         .main-navigation li a { 
    1377                 border-bottom: 0; 
    1378                 line-height: 3.692307692; 
    1379         } 
    13801374        .main-navigation li ul { 
    13811375                display: none; 
    13821376                margin: 0; 
     
    13861380                z-index: 1; 
    13871381        } 
    13881382        .main-navigation li ul ul { 
    1389                 margin-left: 0; 
    13901383                top: 0; 
    13911384                left: 100%; 
    13921385        } 
     
    15481541        .site-content nav, 
    15491542        .widget-area, 
    15501543        img.header-image, 
    1551         nav.site-navigation { 
     1544        .main-navigation { 
    15521545                display: none; 
    15531546        } 
    15541547        .wrapper { 
  • wp-content/themes/twentytwelve/js/navigation.js

     
    33 * 
    44 * Handles toggling the navigation menu for small screens. 
    55 */ 
     6( function() { 
     7    var button = document.getElementById( 'site-navigation' ).getElementsByTagName( 'h3' )[0], 
     8        menu   = document.getElementById( 'site-navigation' ).getElementsByTagName( 'ul' )[0]; 
    69 
    7 jQuery( document ).ready( function( $ ) { 
    8         if ( ! $( '#masthead .menu' ).children().length ) { 
    9                 $( '#masthead .menu-toggle' ).hide(); 
    10         } 
     10    if ( undefined == button || undefined == menu ) 
     11        return false; 
    1112 
    12         $( '.menu-toggle' ).off( 'click' ).click( function() { 
    13                 $( '#masthead .menu' ).stop().slideToggle(); 
    14                 $( this ).toggleClass( 'toggled-on' ); 
    15         } ); 
    16 } ); 
    17  No newline at end of file 
     13    button.onclick = function() { 
     14        if ( -1 == menu.className.indexOf( 'nav-menu' ) ) 
     15            menu.className = 'nav-menu'; 
     16 
     17        if ( -1 != button.className.indexOf( 'toggled-on' ) ) { 
     18            button.className = button.className.replace( ' toggled-on', '' ); 
     19            menu.className = menu.className.replace( ' toggled-on', '' ); 
     20        } else { 
     21            button.className += ' toggled-on'; 
     22            menu.className += ' toggled-on'; 
     23        } 
     24    }; 
     25 
     26    // Hide menu toggle button if menu is empty. 
     27    if ( ! menu.childNodes.length ) 
     28        button.style.display = 'none'; 
     29} )(); 
     30 No newline at end of file 
  • wp-content/themes/twentytwelve/header.php

     
    3535                        <h2 class="site-description"><?php bloginfo( 'description' ); ?></h2> 
    3636                </hgroup> 
    3737 
    38                 <nav class="site-navigation main-navigation" role="navigation"> 
     38                <nav id="site-navigation" class="main-navigation" role="navigation"> 
    3939                        <h3 class="menu-toggle"><?php _e( 'Show menu', 'twentytwelve' ); ?></h3> 
    4040                        <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> 
    41                         <?php wp_nav_menu( array( 'theme_location' => 'primary' ) ); ?> 
     41                        <?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu' ) ); ?> 
    4242                </nav> 
    4343 
    4444                <?php $header_image = get_header_image(); 
  • wp-content/themes/twentytwelve/functions.php

     
    104104         * JavaScript for handling navigation menus and the resized 
    105105         * styles for small screen sizes. 
    106106         */ 
    107         wp_enqueue_script( 'twentytwelve-navigation', get_template_directory_uri() . '/js/navigation.js', array( 'jquery' ), '20120820', true ); 
     107        wp_enqueue_script( 'twentytwelve-navigation', get_template_directory_uri() . '/js/navigation.js', array(), '20120820', true ); 
    108108 
    109109        /** 
    110110         * Load special font CSS file.