mirror of
https://git.sindominio.net/estibadores/wordpress.git
synced 2024-11-14 23:21:07 +01:00
94 lines
2.5 KiB
JavaScript
94 lines
2.5 KiB
JavaScript
/**
|
|
* navigation.js
|
|
*
|
|
* Handles toggling the navigation menu for small screens.
|
|
*/
|
|
( function() {
|
|
|
|
var container, button, menu;
|
|
|
|
container = document.getElementById( 'site-navigation' );
|
|
if ( !container ) {
|
|
return;
|
|
}
|
|
|
|
button = container.getElementsByTagName( 'h3' )[ 0 ];
|
|
if ( 'undefined' === typeof button ) {
|
|
return;
|
|
}
|
|
|
|
menu = container.getElementsByTagName( 'ul' )[ 0 ];
|
|
|
|
// Hide menu toggle button if menu is empty and return early.
|
|
if ( 'undefined' === typeof menu ) {
|
|
button.style.display = 'none';
|
|
return;
|
|
}
|
|
|
|
if ( -1 === menu.className.indexOf( 'nav-menu' ) ) {
|
|
menu.className += 'nav-menu';
|
|
}
|
|
|
|
button.onclick = function() {
|
|
if ( -1 !== container.className.indexOf( 'main-small-navigation' ) ) {
|
|
container.className = container.className.replace( 'main-small-navigation', 'main-navigation' );
|
|
} else {
|
|
container.className = container.className.replace( 'main-navigation', 'main-small-navigation' );
|
|
}
|
|
};
|
|
|
|
} )();
|
|
jQuery( document ).ready( function() {
|
|
|
|
jQuery( '#site-navigation .menu-item-has-children' ).append( '<span class="sub-toggle"> <i class="fa fa-caret-down"></i> </span>' );
|
|
|
|
jQuery( '#site-navigation .sub-toggle' ).click( function() {
|
|
|
|
jQuery( this ).parent( '.menu-item-has-children' ).children( 'ul.sub-menu' ).first().slideToggle( '1000' );
|
|
jQuery( this ).children( '.fa-caret-right' ).first().toggleClass( 'fa-caret-down' );
|
|
jQuery( this ).toggleClass( 'active' );
|
|
|
|
} );
|
|
|
|
} );
|
|
|
|
// Show Submenu on click on touch enabled deviced
|
|
( function() {
|
|
|
|
var container = document.getElementById( 'site-navigation' );
|
|
|
|
/**
|
|
* Toggles `focus` class to allow submenu access on tablets.
|
|
*/
|
|
( function( container ) {
|
|
|
|
var touchStartFn, i,
|
|
parentLink = container.querySelectorAll( '.menu-item-has-children > a, .page_item_has_children > a' );
|
|
|
|
if ( 'ontouchstart' in window ) {
|
|
touchStartFn = function( e ) {
|
|
var menuItem = this.parentNode, i;
|
|
|
|
if ( !menuItem.classList.contains( 'focus' ) ) {
|
|
e.preventDefault();
|
|
for ( i = 0; i < menuItem.parentNode.children.length; ++i ) {
|
|
if ( menuItem === menuItem.parentNode.children[ i ] ) {
|
|
continue;
|
|
}
|
|
menuItem.parentNode.children[ i ].classList.remove( 'focus' );
|
|
}
|
|
menuItem.classList.add( 'focus' );
|
|
} else {
|
|
menuItem.classList.remove( 'focus' );
|
|
}
|
|
};
|
|
|
|
for ( i = 0; i < parentLink.length; ++i ) {
|
|
parentLink[ i ].addEventListener( 'touchstart', touchStartFn, false );
|
|
}
|
|
}
|
|
|
|
}( container ) );
|
|
|
|
} )();
|