Se connecter avec
S'enregistrer | Connectez-vous

Menu déroulant vertical

Dernière réponse : dans Programmation

Bonjour

j'ai trouvé un site avec un menu vertical déroulant très sympa et j'aimerai bien récupérer le code mais chez moi il ne marche pas :-(

Voici ce que j'ai récupéré :
Citation :
<head>
<title></title>
<script language="JavaScript" type="text/javascript">
function opennav(submenu) {
navRoot = document.getElementById("menu");
for (i=0; i<navRoot.childNodes.length; i++) {
node = navRoot.childNodes;
if (node.nodeName=="LI" && node == submenu) {
node.className=node.className ="open";
}
else {
node.className="close";
}
//alert(node.nodeName + " "+ node.id + " : " + node.className)
}
}

function test(submenu) {
alert(submenu.id)
}

startList = function() {
navRoot = document.getElementById("menu");
for (i=0; i<navRoot.childNodes.length; i++) {
node = navRoot.childNodes;
if (node.nodeName=="LI") {
node.onclick=function() {
opennav(this);
}

if (node.className.length==0) node.className="close"
}
}
}
window.onload=startList;
</script>
</head>
<body>
<div id="navigation">
<ul id="menu">
<li id="m1"><a href="#" title="Menu A">Menu A</a>
<ul>
<li><a href="/pages/a.php" title="SousMenu A">• SousMenu A</a></li>
<li><a href="/pages/b.php" title="SousMenu B">• SousMenu B</a></li>
<li><a href="/pages/c.php" title="SousMenu C">• SousMenu C</a></li>
</ul>
</li>
<li id="m2"><a href="#" title="Menu B">Menu B</a>
<ul>
<li><a href="/pages/d.php" title="SousMenu D">• SousMenu D</a></li>
<li><a href="/pages/e.php" title="SousMenu E">• SousMenu E</a></li>
</ul>
</li>
</ul>
</div>
</body>
</html>


Si vous voulez voir le site où je l'aitrouvé :
http://www.admr.org/

Merci pour l'aide afin de le faire fonctionner

Autres pages sur : menu deroulant vertical

Lassé par la pub ? Créez un compte

En plus sur le site d'origine, le menu est curieusement programmé : au chargement de la page, il est déroulé en totalité.. Ce n'est qu'après que la page soit chargée en totalité que ce menu se contracte, laissant un effet particulièrement déroutant et brouillon !! Ce fonctionnement ne lui permet qu'une chose : rester pleinement disponible au cas où le navigateur client n'a pas JS activé.. Ce type de menu (et en mieux) est d'ailleurs un classique du JS..

Mais, comme dit KangOl, la même chose est très aisément faisable en CSS.. Les liens fournis dans le topic pinné en haut de la liste te permettront de retrouver des tutos dans cette direction..

:jap: 
Lassé par la pub ? Créez un compte

Créer un nouveau sujet