Débutant sèche sur menu javascript (facile)

Bonjour,

Je chercher à reproduire le même comportement que le menu proposé sur alsacreations : http://css.alsacreations.com/xmedia/exemples/deroulant/cssmenu3.htm

Utilisant Joomla, je ne maitrise pas le code html fournis, je cherche donc à modifier le javascript afin de s'adapter à ce code.

Voici où j'en suis après de multiples essais et tatonnement :
1 - Je demande au script de modifier le style des sous-menus pour les masquer. (Etape réussie)
2 - Je demande d'afficher le sous-menus en cas de clic sur l'élément parent (Je sèche)

Je pensais faire une sélection des élément parent avec ClassName(parent) puis de trouver une méthode qui me permet d'afficher le sous-menu qui à été masqué.


Code JAVASCRIPT

function montre(id) {
var d = document.getElementById(id);
	for (var i = 1; i<=10; i++) {
		if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
	}
// On masque les sous-menu
if (d) {d.style.display='block';}
// Si le ID est spécifé dans la fonction on affiche le sous-menu correspondant
}

function displayPics() {
var photos = document.getElementById('galerie_mini') ;
// On récupère l'élément ayant pour id galerie_mini
var parents = photos.getElementsByClassName('parent') ;
// On récupère dans une variable tous les element parent
//var liens = parents.getElementsByTagName('a') ;
// On récupère dans une variable tous les liens des element parent

// Une boucle parcourant l'ensemble des liens contenu dans galerie_mini
for (var i = 0 ; i < parents.length ; ++i) {
	// Au clique sur ces liens 
	parents[i].onclick = function() {
		document.getElementById(this.element).style.display='block';
		return false; // Et pour finir on inhibe l'action réelle du lien
	};
}
}
window.onload = function() { montre(); displayPics(); };

Code HTML

><ul class="menu_onglet" id="galerie_mini">
    <li id="current" class="parent active item54"><a href="#"><span>Europe du sud</span></a>
        <ul id="smenu1">
          <li class="item65"><a href="48&amp;Itemid=65"><span>Albanie</span></a></li>
          <li class="item66"><a href="52&amp;Itemid=66"><span>Bosnie-Herz&eacute;govine</span></a></li>
        </ul>
    </li>
    <li class="parent item55"><a href="#"><span>Europe de l'est</span></a>
        <ul id="smenu2">
          <li class="item74"><a href="46&amp;Itemid=74"><span>Bulgarie</span></a></li>
          <li class="item75"><a href="65&amp;Itemid=75"><span>Moldavie</span></a></li>
        </ul>
    </li>
    <li class="parent item57"><a href="#"><span>Moyen-orient</span></a>
        <ul id="smenu3">
          <li class="item79"><a href="49&amp;Itemid=79"><span>Azerba&iuml;djan</span></a></li>
          <li class="item80"><a href="56&amp;Itemid=80"><span>G&eacute;orgie</span></a></li>
        </ul>
    </li>
  </ul>

[/i]
Modifié par percherie (19 Aug 2008 - 14:53)