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

Soyez le premier à donner votre avis sur cette source.

Snippet vu 29 848 fois - Téléchargée 27 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
-
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.