Amélioration du menu déroulant très simple posté il y a quinze jours

Contenu du snippet

Dans le menu que j'avais présenté il y a quelques temps, si on recliquait sur une rubrique déjà déroulée, rien ne se passait. j'ai modifié légèrement le code pour que cette action ré-enroule le menu.

voici ce code modifié

Il faut l'enregistrer dans un fichier javascript de nom "code.js"

A utiliser comme précédemment :

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>
</ul>
</div>
</body>
</html>

Source / Exemple :


// JavaScript Document 
   
var menu = new Array(); 
menu[0]="<ul><li><a href='document 1-1.htm'>1.1</a></li><li><a href='document 1-2.htm'>1.2</a></li></ul>"; 
menu[1]="<ul><li><a href='document 2-1.htm'>2.1</a></li><li><a href='document 2-2.htm'>2.2</a></li></ul>"; 
  
var liste; 
  
var flag = new Array(); 
  
var ancIndex=-1; 
var ancLigne=""; 
  
function init() 
{ 
    liste=document.getElementById("menu").getElementsByTagName("Li"); 
    for(var i=0 ; i < liste.length ; i++) 
    { 
            flag[i]=0; 
    } 
} 
  
function debut(i) 
{     
    if (flag[i]==0) 
    { 
                if (ancIndex>=0) 
                { 
                    liste[ancIndex].innerHTML=ancLigne; 
                    flag[ancIndex]=0; 
                } 
                ancLigne=liste[i].innerHTML 
                ancIndex=i; 
                liste[i].innerHTML+=menu[i]; 
                flag[i]=1; 
    } 
    else 
    { 
            liste[i].innerHTML=ancLigne; 
            ancIndex=-1; 
            ancLigne=""; 
            flag[i]=0; 
    }         
             
}

A voir également

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.