// JavaScript Document /*************************************************************************************************************** menu en javascript présent sur toutes les pages développé pour la maire de Tullins par Benjamin Mottet 05/2004 Contacts http://www.bmott.fr.st ou kabush13@hotmail.com ****************************************************************************************************************/ /******** ajout de nouveaux items ********************************************** si il s'agit d'une nouvelle partie: Dans le .js * ajouter un nouveau tableau dans la declaration de tableau :: mnu[5]=new Array(); * mettre en place les differents items du menu :: mnu[5][0]=''; mnu[5][1]=''; * ajouter un pictogramme, et la boucle pour l'afficher et l enlever Dans le .html ou .php * ajouter le pictograme a la suite des autres avec les mêmes caracteristiques css * changer la variable dans body onLoad="pointeur=5;image=5;ecrit()" si il s'agit d'un sous item: dans le .js * ajouter le nouvelle item au menu correspondant * changer le liens dans le .html * creer un fichier correspondant au nouvel item Principe du menu: Le principe du menu est de stocker tous les liens dans un tableau. Il fait apparaitre les indice j qui corresponde à la seconde dimension du tableau en fonction de i. L'interet de ce menu est qu'il fonctionne sans frame. Pour afficher le tableau dynamiquement on utilise une variable contenu qui contient tout ce qui doit etre afficher en fonction des rollover. **********************************************************************************/ var contenu=""; // variable contenu qui stock le menu, elle est appelé par un
dans le fichier html lié var mnu = new Array(); // declaration des tableaux qui contiennent les items mnu[0] = new Array(); mnu[1] = new Array(); mnu[2] = new Array(); mnu[3] = new Array(); mnu[4] = new Array(); mnu[5] = new Array(); //mnu[6] = new Array(); //mnu[i][j] mnu[0][0]='L\' équipe municipale'; // menu mnu[0][1]='Le Trombinoscope';//sous item 1 mnu[0][2]='Les délégations ';//sous item 2 mnu[0][3]='Les commissions municipales ';// sous item 3 mnu[0][4]='Comptes rendus '; //mnu[0][5]='Item 5 '; mnu[1][0]='Les services municipaux'; mnu[1][1]='Le CCAS'; mnu[1][2]='Le SIVOM '; mnu[1][3]='Services municipaux '; mnu[1][4]='Les permanences locales '; // mnu[1][4]='item 4 '; mnu[2][0]='Le patrimoine historique'; mnu[2][1]='Armoiries'; mnu[2][2]='Le clos des Chartreux'; mnu[2][3]='Michel Perret'; mnu[2][4]='Gaston Valois'; mnu[2][5]='Stendhal'; mnu[2][6]='Patrimoine historique'; //mnu[2][5]='Item 5'; mnu[3][0]='L\' actualité'; mnu[3][1]='L\'agenda '; mnu[3][2]='Couleur locale'; mnu[3][3]='La gazette'; mnu[3][4]='Le cinéma'; //mnu[3][5]='Item 5'; mnu[4][0]='Vivre à Tullins Fures'; mnu[4][1]='La vie professionnelle '; mnu[4][2]='La vie pratique'; mnu[4][3]='la vie associative'; //mnu[4][5]='item 5'; mnu[5][0]='Tullins en ligne'; mnu[5][1]='Plan local d\'urbanisme'; mnu[5][2]='Les achats publics'; //mnu[5][3]='sous item3'; //mnu[5][4]='sous item4'; //mnu[6][0]='Nom du nouveau menu'; //mnu[6][1]='SOus item1'; //mnu[6][2]='sous item2'; //mnu[6][3]='sous item3'; //mnu[6][4]='sous item4'; var pointeur =""; // variable definit dans le body onload de chque fichier lié Mettre a 5 pour un nouveau menu dans le fichier html var image =""; // variable definit dans le body onload de chque fichier lié Mettre a 5 pour un nouveau menu dans le fichier html function ecrit() // function appelé dans le body de chaque fichier lié { contenu=""; // variable contenu qui stock le menu, elle est appelé par un
dans le fichier html lié var i = 0; // pointe sur le premier menu var j = 1; // pointe sur le premier item de sous menu j= 0 correspondant au nom du menu while (i < mnu.length){ contenu+="
"; var text='' + mnu[ i ][0]+''; // création du liens et réaffectation de variable pointeur et image dans la fonction affecte contenu+=text; contenu+=""; if (pointeur==i) { while (j < mnu[ i ].length) // mise en place du menu dans la variable contenu { contenu+="
"; contenu+="     "; contenu+=mnu[ i ][j]; contenu+=" "; j = j +1; if (image==0){ document.getElementById('monImage0').style.visibility = "visible"; // permet de mettre le bon pictogramme sur les rolls over }else{document.getElementById('monImage0').style.visibility = "hidden"; } if (image==1){ document.getElementById('monImage1').style.visibility = "visible"; }else{document.getElementById('monImage1').style.visibility = "hidden"; } if (image==2){ document.getElementById('monImage2').style.visibility = "visible"; }else{document.getElementById('monImage2').style.visibility = "hidden"; } if (image==3){ document.getElementById('monImage3').style.visibility = "visible"; }else{document.getElementById('monImage3').style.visibility = "hidden"; } if (image==4){ document.getElementById('monImage4').style.visibility = "visible"; }else{document.getElementById('monImage4').style.visibility = "hidden"; } if (image==5){ document.getElementById('monImage5').style.visibility = "visible"; }else{document.getElementById('monImage5').style.visibility = "hidden"; } // if (image==5){ // a ne modifier qu'en ajout //document.getElementById('monImage5').style.visibility = "visible"; //de nouvelle partie cela ne //}else{document.getElementById('monImage5').style.visibility = "hidden"; //concerne pas les item ou sous item //} } } contenu+="
"; j = 1; // incrementation des indices pour afficher tous les items i = i +1; // i ==> differentes parties j==> different items en fonctions des parties } document.getElementById("ici").innerHTML=contenu; // permet d'afficher le menu sur la page au moyen d'un div } function affecte(num){ // fonction qui increment la variable pointeur et image et refait passer dans la boucle ecrit pointeur= num; image= num; ecrit(); } // bonne chance pour toutes modifications ben :)