Dynamic menu and name (sub) menus v1.0

Soyez le premier à donner votre avis sur cette source.

Vue 6 637 fois - Téléchargée 836 fois

Description

<B>ATTENTION</B>::: Pour ceux qui souhaiterais utilise cette source dans un site a reference, ce n'est pas une bonne idee.(Plus d'explication dans les commentaires. (Merci a Kimjoa).

Il y a environ un mois j'ai lu une source (Parmis des centaines) sur un menu. le menu en lui meme etait ecris en html. J'ai alors laisser un message disant pourquoi ne pas avoir fais une boucle? Et la je me suis creuse la tete pour faire naitre ce script. J'aurais aime pouvoir rendre le developpement du nombre de menu au meme niveau que celui des sous menus tels que j ajouterais le nom du menu dans l'array et le script ferais tous le reste pour moi. Si quelqu un a une idee a ce sujet je suis preneur.
En attendant contentez vous de la version 1.0

Source / Exemple :


<html>
	<head>
		<title>Dynamic Menu</title>
		<script language="javascript" src="js/menu_js.js"></script>
	</head>
	<body onload="hideMenu();">
		Create by Astro Production!<Br> Creez par Astro Production. <br>
		PS: Je n'ecris pas super bien en anglais donc desole pour les fautes.
		<hr>
		<script language=javascript>
			/*to add a new menu you need to copy paste a number of things:
			first: the else if below you need to upgrade 1 more menu Attention to the X +namesSubMenusX[t]+,
			and t<=names subMenusX.length-1.
			Second: in the js you need to put a copy of the showHideMenusX function and to upgrade i=X;
			Of course don't forgot the new name menu in the array!*/
			var namesMenus = new Array ('Histoire','Geographie','Physique','Maths','Litterature');
			
			
			/*to add a subMenus you only needs to push it in the array at the place you want*/
			/*for example I add 'New book of geographie'.
			var namesSubMenus1 = new Array ('Geographie - Vol 1','GeoMap','New book of geographie','Histoire de la geographie');
			If you used an array for links give the name of the link of the new SubMenu*/
			var namesSubMenus0 = new Array ('Histoire - Vol 1','Histoire Politique');
			var namesSubMenus1 = new Array ('Geographie - Vol 1','GeoMap','Histoire de la geographie');
			var namesSubMenus2 = new Array ('Physique et Chimie','Relation Physique','La physique atomique','Un Physique de plomb');
			var namesSubMenus3 = new Array ('Mathematiques pour debutant','Mathematiques avances');
			var namesSubMenus4 = new Array ('Litterature Volume1');
			
			/*links array*/
			var links_subMenus = new Array ('Histoire1.html','Histoire2.php'); /*for namesSubMenus0*/
			var links_subMenusL = new Array ('Math1','Math2');  /*for namesSubMenus3*/
			
			
			/*for the submenuslink dont forgot a variable if you use the same name or you can create an array
			i is the index in the namesMenu Array, y is the index of the var namesSubMenusY, and t is the index in the array namesSubMenusY*/
			for(i=0,y=0;i<=namesMenus.length-1,y<=('namesSubMenus'+i).length-1;i++,y++){
				document.write('<div><a href="#" onclick="showHideSubMenus'+i+'();">'+namesMenus[i]+'</a>')
				//alert(document.getElementsByTagName('div')[i].id);
				document.write('<ul name="namesSubMenus" id="'+y+'">');
				if(y == 0){
					for(t=0;t<=namesSubMenus0.length-1;t++){
						document.write('<li><a href="'+links_subMenus[t]+'">'+namesSubMenus0[t]+'</a></li>');	
					}
				}
				else if (y == 1){
					for(t=0;t<=namesSubMenus1.length-1;t++){
						document.write('<li><a href="subMenus1_'+t+'.html">'+namesSubMenus1[t]+'</a></li>');	
					}	
				}
				else if (y == 2){
					for(t=0;t<=namesSubMenus2.length-1;t++){
						document.write('<li><a href="subMenus2_'+t+'.html">'+namesSubMenus2[t]+'</a></li>');	
					}	
				}
				else if (y == 3){
					for(t=0;t<=namesSubMenus3.length-1;t++){
						document.write('<li><a href="'+links_subMenusL[t]+'.html">'+namesSubMenus3[t]+'</a></li>');	
					}	
				}
				else {
					for(t=0;t<=namesSubMenus4.length-1;t++){
						document.write('<li><a href="subMenus4_'+t+'.html">'+namesSubMenus4[t]+'</a></li>');	
					}
					break;	
				}
				document.write('</ul></div>');
			}
			document.write('</div><div><a href="#" onclick="showHideAllTheMenu();">Inverse all the menu</a></div>');
				
		</script>
	</body>
</html>

Conclusion :


Ceci est mon premier code sources.

Codes Sources

A voir également

Ajouter un commentaire Commentaires
cs_edr
Messages postés
8
Date d'inscription
mercredi 13 avril 2005
Statut
Membre
Dernière intervention
24 mars 2009

15 janv. 2009 à 20:24
ok, si je trouve le temps je ferai une version :)

++DigitalCoder
astro53
Messages postés
48
Date d'inscription
jeudi 18 octobre 2007
Statut
Membre
Dernière intervention
5 août 2009

15 janv. 2009 à 08:58
Merci, pour les conseils EDR, je vais me mettre au travail des ce week end...
Esperant en debut de semaine prochaine presenter la versions PHP du menu.
cs_edr
Messages postés
8
Date d'inscription
mercredi 13 avril 2005
Statut
Membre
Dernière intervention
24 mars 2009

14 janv. 2009 à 23:21
je te conseille de générer dynamiquement ton code html via le php (surtout que tu utilise des tableau de données, tu pourrais même utiliser un fichier texte externe par categorie voir du xml) et ensuite utiliser jquery pour les effet, tu auras bcp moins de ligne et cela sera plus clair. en plus ton menu pourra même être référençable, administrable en externe, même si ce n'est pas le but initial :)

++DigitalCoder
astro53
Messages postés
48
Date d'inscription
jeudi 18 octobre 2007
Statut
Membre
Dernière intervention
5 août 2009

13 janv. 2009 à 08:52
Salut EDR, je sais utiliser jquery mais je vois pas comment ameliorer ma situation...meme avec jquery.
cs_edr
Messages postés
8
Date d'inscription
mercredi 13 avril 2005
Statut
Membre
Dernière intervention
24 mars 2009

12 janv. 2009 à 22:43
je te conseille d'essayer jQuery
Afficher les 9 commentaires

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.