| 11 | | |
| 12 | | $.fn.smallMenu = function() { |
| 13 | | masthead.find( '.site-navigation' ).removeClass( 'main-navigation' ).addClass( 'main-small-navigation' ); |
| 14 | | masthead.find( '.site-navigation h3' ).removeClass( 'assistive-text' ).addClass( 'menu-toggle' ); |
| 15 | | |
| 16 | | $( '.menu-toggle' ).off( 'click' ).click( function() { |
| 17 | | masthead.find( '.menu' ).slideToggle(); |
| 18 | | $( this ).toggleClass( 'toggled-on' ); |
| | 12 | |
| | 13 | // Check for menu items. |
| | 14 | if ( '0' != masthead.find( '.menu' ).children().length ) { |
| | 15 | |
| | 16 | $.fn.smallMenu = function() { |
| | 17 | masthead.find( '.site-navigation' ).removeClass( 'main-navigation' ).addClass( 'main-small-navigation' ); |
| | 18 | masthead.find( '.site-navigation h3' ).removeClass( 'assistive-text' ).addClass( 'menu-toggle' ); |
| | 19 | |
| | 20 | $( '.menu-toggle' ).off( 'click' ).click( function() { |
| | 21 | masthead.find( '.menu' ).slideToggle(); |
| | 22 | $( this ).toggleClass( 'toggled-on' ); |
| | 23 | } ); |
| | 24 | }; |
| | 25 | |
| | 26 | // Check viewport width on first load. |
| | 27 | if ( smallWindow.matches ) |
| | 28 | $.fn.smallMenu(); |
| | 29 | |
| | 30 | // Check viewport width when user resizes the browser window. |
| | 31 | $( window ).resize( function() { |
| | 32 | if ( false !== timeout ) |
| | 33 | clearTimeout( timeout ); |
| | 34 | |
| | 35 | timeout = setTimeout( function() { |
| | 36 | if ( smallWindow.matches ) { |
| | 37 | $.fn.smallMenu(); |
| | 38 | } else { |
| | 39 | masthead.find( '.site-navigation' ).removeClass( 'main-small-navigation' ).addClass( 'main-navigation' ); |
| | 40 | masthead.find( '.site-navigation h3' ).removeClass( 'menu-toggle' ).addClass( 'assistive-text' ); |
| | 41 | masthead.find( '.menu' ).removeAttr( 'style' ); |
| | 42 | } |
| | 43 | }, 200 ); |
| 20 | | }; |
| 21 | | |
| 22 | | // Check viewport width on first load. |
| 23 | | if ( ! largeWindow.matches ) |
| 24 | | $.fn.smallMenu(); |
| 25 | | |
| 26 | | // Check viewport width when user resizes the browser window. |
| 27 | | $( window ).resize( function() { |
| 28 | | if ( false !== timeout ) |
| 29 | | clearTimeout( timeout ); |
| 30 | | |
| 31 | | timeout = setTimeout( function() { |
| 32 | | if ( ! largeWindow.matches ) { |
| 33 | | $.fn.smallMenu(); |
| 34 | | } else { |
| 35 | | masthead.find( '.site-navigation' ).removeClass( 'main-small-navigation' ).addClass( 'main-navigation' ); |
| 36 | | masthead.find( '.site-navigation h3' ).removeClass( 'menu-toggle' ).addClass( 'assistive-text' ); |
| 37 | | masthead.find( '.menu' ).removeAttr( 'style' ); |
| 38 | | } |
| 39 | | }, 200 ); |
| 40 | | } ); |
| | 45 | } |