MENU DÉROULANT (JE SAIS.... ENCORE...) EN JAVASCRIPT & CSS.

La page à afficher :
Fo mettre ce qui fo

<LINK href="../css/Menu.css" rel="stylesheet" type="text/css">
<LINK href="../css/Page.css" rel="stylesheet" type="text/css">
<script src="../menu/OptionMenu.js"></script>
<script src="../menu/ULMenu.js"></script>


            <TD><!-- Début du menu Là où cela vous arrange, MAIS une table est toujours bien -->
              <script>Display_Menu();</script>
              <!-- Fin du menu -->
            </TD>

/*Dans le fichier ULMenu.js
function Display_Menu() {
var i= 0, j = 0;

	// Début du layer qui contient le menu
	document.write('<DIV id="div_Menu">');
	document.write('<UL id="ul_MainMenu">'); // Début bloc UL niveau 1.  Ne pas oublier l'id, c'est l'objet de base.
				
	// Début affichage du menu (bloc LI) de niveau 1

	for (i = 0; i < iNbMenu; i++) {
		document.write('<LI><A href="#"> ' + aMenu[i][0] + '</A><UL>'); // Le texte niveau 1 à afficher
		for (j = 1; j < aMenu[i].length; j++) {
			// Début affichage du menu de niveau 2
			document.write('<LI><A href="');  // Début affichage du menu (bloc LI) de niveau 2
			document.write(SplitOptionSsMenu(aMenu[i][j], 'URL')); // Ici le lien vers la page à afficher
			document.write('"> <img src="');
			// Placer une image (25x25). Si pas TOUJOURS placer une invisible.
			document.write(SplitOptionSsMenu(aMenu[i][j], 'IMG')); 
			document.write('"> ° ');
			document.write(SplitOptionSsMenu(aMenu[i][j], 'TXT')); // Le texte niveau 2 à afficher
			document.write('</A></LI>');  // Fin affichage du menu (bloc LI) de niveau 2
		}
		document.write('</UL>'); // Fin bloc UL niveau 2
		// Fin affichage du menu de niveau 2
		document.write('</LI>');// Fin affichage du menu (bloc LI) de niveau 1
	}

	document.write('</UL>'); // Début bloc UL niveau 1
	document.write('</DIV>');
	// Fin du layer qui contient le menu
}


Le fichier OptionMenu.js comprend une la fonction qui retourne les URL, IMG, et TXT ---> SplitOptionSsMenu

Celle-ci est basée sur un tableau à 2 dimensions de string qui contiennent les infos nécessaire à l'affichage.
Du genre :

	aMenu[0] = new Array(5);
	aMenu[0][0] = 'Le Jack Russell';
	aMenu[0][1] = 'Jack Russell' + SEPARATOR_URL + 'JackRussell.htm' + SEPARATOR_IMG + '../menu/petitjack.gif';
	aMenu[0][2] = 'Son histoire' + SEPARATOR_URL + 'JohnRussell.htm' + SEPARATOR_IMG + '../menu/Histoire.gif';

Et la fonctoin lit et retourne :

function SplitOptionSsMenu(sOption, sType) {
var iPos1 = 0, iPos2 = 0;
var sRetValue = '';

	switch (sType) {
		case 'TXT':
			sRetValue = sOption.substr(0,sOption.indexOf(SEPARATOR_URL));
			break;
		case 'URL':
			iPos1 = sOption.indexOf(SEPARATOR_URL) + 2, sOption.length;
			iPos2 = sOption.indexOf(SEPARATOR_IMG), sOption.length;
			sRetValue = sOption.substring(iPos1, iPos2);
			break;
		case 'IMG':
			sRetValue = sOption.substr(sOption.indexOf(SEPARATOR_IMG) + 2,sOption.length);
			break;
	}
return sRetValue;
}


Et voilà ...........

Je vous fournis le zip avec ce qui est nécessaire.

J'ai testé en FireFox 1.5.0.3 et IE 6.0.2800.  Mais j'ai pas le temps de voir avec les autres.  Donc si vous avez un autre browser ... dites moi koi

Fab