Un menu déroulant très simple d'emploi

5/5 (1 avis)

Snippet vu 40 630 fois - Téléchargée 29 fois

Contenu du snippet

Après m'être battu pendant deux jours avec des codes tout fait pour des menus déroulants et sans connaître JavaScript, ne trouvant pas ce que je voulais ou alors de véritables usines à gaz, j'ai réalisé ce petit script qui me donne satisfaction.
A chacun de l'utiliser à sa façon.

Source / Exemple :


// JavaScript Document

var menu = new Array();
menu[0]="<ul><li>1.1</li><li>1.2</li></ul>";
menu[1]="<ul><li>2.1</li><li>2.2</li></ul>";
menu[2]="<ul><li>3.1</li><li>3.2</li><li>3.3</li><li>3.4</li></ul>";
menu[3]="<ul><li>4.1</li><li>4.2</li></ul>";

var liste;

var ancIndex=-1;
var ancLigne="";

function init()
{
	liste=document.getElementById("menu").getElementsByTagName("Li");
}

function debut(i)
{	
			if (ancIndex>=0)
			{
				liste[ancIndex].innerHTML=ancLigne;
			}
			ancLigne=liste[i].innerHTML
			ancIndex=i;
			liste[i].innerHTML+=menu[i];
}

Conclusion :


A utiliser dans un document HTML de ce genre

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Document sans titre</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript" type="text/JavaScript" src="code.js"></script>

</head>

<body onLoad="init()">
<p align="center">
<font face="Arial" size='10' color='#000000'>
<strong>MENU</strong>
</font>
</p>

<div id="menu">
<ul>
<li><a href="#" onClick="debut(0)">1</a></li>
<li><a href="#" onClick="debut(1)">2</a></li>
<li><a href="#" onClick="debut(2)">3</a></li>
<li><a href="#" onClick="debut(3)">4</a></li>
</ul>
</div>
</body>
</html>

A voir également

Ajouter un commentaire Commentaire
salhaouikhadija
Messages postés
2
Date d'inscription
lundi 2 avril 2007
Statut
Membre
Dernière intervention
19 octobre 2007

19 oct. 2007 à 10:25
et oui superbe mici bp

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.