11484 sujets

JavaScript, DOM et API Web HTML5

2 menus différents pour un même script ?

Bonjour à tous

Je bricole une page en php pour usage perso. j'ai un menu général positionné horizontalement et un deuxième verticale à l'intérieur du document.

Leurs dispositions (horizontal, verticale) nécessite un code css différent pour chacun d'eux, J'ai donc une div id="menu_h" et une autre pour "menu_v".

Ma question concerne le script utilisé pour chacun d'eux, puisque c'est exactement le même.

Alors plutôt que d'avoir 2 scripts identique (un pour #menu_h et un autre pour #menu_v), est-il possible d'indiquer au script que "cette" fonction est valide pour id menu_h ET menu_v ?

Merci d'avance

( function( $ ) {    // Menu et sous menu deroulant
$( document ).ready(function() {
$('#menu_h > ul > li > a').click(function() {
  $('#menu_h li').removeClass('active');
  $(this).closest('li').addClass('active');	
  var checkElement = $(this).next();
  if((checkElement.is('ul')) && (checkElement.is(':visible'))) {
    $(this).closest('li').removeClass('active');
    checkElement.slideUp('normal');
  }
  if((checkElement.is('ul')) && (!checkElement.is(':visible'))) {
    $('#menu_h ul ul:visible').slideUp('normal');
    checkElement.slideDown('normal');
  }
  if($(this).closest('li').find('ul').children().length == 0) {
    return true;
  } else {
    return false;	
  }		
});
});
} )( jQuery );

Modifié par nitsua72 (24 Jul 2014 - 16:31)
Bonjour, je te conseille de créer un plugin que tu utiliseras pour les deux éléments #menu_* qui d'ailleurs pourrons dès lors se passer de cet identifiant et partager la même classe (.menu par exemple).

Sinon, au lieu d'utiliser ceci :

$('#menu_h > ul > li > a').click(function() {...});


utilise plutôt ceci :

$('#menu_h').on('click', 'ul li a', function() {...});


par ailleurs, stocke $(this) dans une variable et utilise-la au lieu de l'appeler plusieurs fois :


var $this = $(this);
...
var checkElement = $(this).next();
...
$this.closest('li').addClass('active');


@+
Sujet clos
Aller à