jQuery: creare un ritardo nella chiusura dei sottomenu di WordPress

jQuery: creare un ritardo nella chiusura dei sottomenu di WordPress

I sottomenu di WordPress sono sempre contrassegnati dalla classe sub-menu e di conseguenza sono facili da individuare. Del resto l'intera struttura dei menu di WordPress usa diversi attributi che rendono più facile utilizzare jQuery per i nostri scopi. Uno di questi è nascondere un sottomenu dopo un certo periodo di tempo.

La procedura è la seguente:


$( "li", "#menu" ).each(function() {
	var $li = $( this ),
		$subMenu = $li.find( "ul.sub-menu" );
		// find() per i diretti discendenti
		
		$li.hover(function() {
			if( $subMenu.is( ":hidden" ) ) {
				$subMenu.stop( true, true ).show();
				// stop() per evitare code nelle animazioni
			}
		}, function() {
			if( $subMenu.is( ":visible" ) ) {
				setTimeout( function() {
					$subMenu.stop( true, true ).hide();	
				}, 600);
			}
		
		});

});

Come si può notare è stato creato un breve ritardo nella chiusura dei sottomenu utilizzando la funzione setTimeout(). Questa tecnica è utile a livello di usabilità dei menu perché consente all'utente di poter restare più a lungo sulle voci del sottomenu.

Torna su