Script Masters : Javascript : Index

Script Masters

Espace membre

Langages

Autres ressources

Ressources graphiques

Recherche

Kit graphique

Liens

Statistiques

Javascript >> Catégorie >> Menus dynamiques >> Double Menu Déroulant Dynamique

Description

Ce script permet d'afficher un menu dynamique à base de liste déroulante. Sélectionnez d'abord un thème, le second menu sera alors générer de façon à n'afficher que les sous catégories pour ce thème.
Un exemple vaut mieux que de grands discours.

Exemple

[Cliquez ici pour visualiser l'exemple]

Informations et statistiques

Internet Explorer : oui
Netscape Navigator : oui
Auteur : Daniel Fabien
Date de création : 31/01/2003

Visualiser : 101443
Dont aujourd'hui : 1
Envoi par mail : 885
Commentaires : 2 ( Voir )

Conseils pour la personalisation du script

Rajoutez un élément au tableau menu pour chaque categorie supplémentaire.
De la même façon, pensez à modifier le formulaire pour rajouter des categories.
Modifiez les variables pour les menus deroulant (menu[n][n] = new Option("Titre","http://www.votre-url.com/") ).
la première valeur est le titre, la seconde l'url. Metter l'url à "null" si vous ne souhaitez pas une redirection pour ce titre.

Le script

Insérer ce script entre les balises <Head> </Head>

/*
Insérer ce script entre les balises <Head> </Head>
*/

/* Daniel Fabien - 31/01/2003
*  Double menu deroulant dynamique
* 
*  Pour tout renseignements :
*  http://www.script-masters.com/home/forum/
* */

menu=new Array()

// Rajoutez un élément au tableau menu pour chaque categorie supplémentaire
// De la même façon, pensez à modifier le formulaire pour rajouter des categories.
menu[0]=new Array()
menu[1]=new Array()
menu[2]=new Array()

// Modifiez ici les variables pour les menus deroulant
// la première valeur est le titre, la seconde l'url
// metter l'url à "null" si vous ne souhaitez pas une redirection pour ce titre

menu[0][0]=new Option("Sous Theme - Internet","null")
menu[0][1]=new Option("Actualite","http://www.script-masters.com/")
menu[0][2]=new Option("Ressources Webmaster","http://www.script-masters.com/")

menu[1][0]=new Option("Sous Theme - Informatique","null")
menu[1][1]=new Option("Programmation","http://www.script-masters.com/")
menu[1][2]=new Option("Materiel","http://www.script-masters.com/")

menu[2][0]=new Option("Sous Theme - Actualité","null")
menu[2][1]=new Option("France","http://www.script-masters.com/")
menu[2][2]=new Option("Monde","http://www.script-masters.com/")

// Ne rien modifié sous cette ligne
function changeSousTheme(numeroMenu){
	for (i=document.menuDeroulant.sousTheme.options.length-1;i>0;i--){
		document.menuDeroulant.sousTheme.options[i]=null
		}
		
	for (i=0;i<menu[numeroMenu].length;i++){
		document.menuDeroulant.sousTheme.options[i]=new Option(menu[numeroMenu][i].text,menu[numeroMenu][i].value)
		}
		
	document.menuDeroulant.sousTheme.selectedIndex=0
	}

function selectmenu(theme_prin){
	if (theme_prin.theme.options[theme_prin.theme.selectedIndex].value == "null"){
		alert('selectionnez d\'abord un theme');
		}
	else{
		window.top.location.href = theme_prin.theme.options[theme_prin.theme.selectedIndex].value;
		}
	}

function destination(){
	var destination = document.menuDeroulant.sousTheme.options[document.menuDeroulant.sousTheme.selectedIndex].value;

if(destination=="null"){
		alert('Veuillez saisir une destination valide!');
	}
	else{
		window.top.location.href = destination;
		}
	}

</SCRIPT>

Insérer ce code entre les balises <Body> </Body>

Recevoir ce script par email

Entrez votre email ci-dessous pour recevoir ce script dans votre boite à lettre

Poster un commentaires :

Plus d'info :

Un problème ? Consultez le forum de Script Masters pour trouver la réponse !

Votre nom de domaine est-il libre?