Bonjour à tous,

J'ai appliqué le code dispo sur ce site pour un menu vertical en css mais j'ai un problème à l'affichage. Certains sous-menus ne se cachent pas alors que cela fonctionne pour d'autres.
Voilà la page en question pour vous rendre compte du résultat :
http://www.leliseur.com/accueil/test.php

J'ai remplacé les onclick par des onmouseover.
Les titres des menus sont récupérés dans une BDD mysql, les titres des sous-catégories associées également.
Comme vous pouvez le voir, certaintes sous-rubriques s'affichent au chargement et ne veulent pas se masquer.

Voilà le code php :

<dl id="menu">
<?php
$req = mysql_query("SELECT categorie.id AS cat, categorie.nom, count(article.id) as total FROM categorie LEFT JOIN article ON categorie.id=article.categorie AND article.sous_categorie = '0' GROUP BY categorie.nom ORDER BY categorie.nom ASC") or die(mysql_error());
while($res = mysql_fetch_assoc($req)){
?>
<dt onmouseover="montre('smenu<?php echo $res['cat']; ?>');"><a href="../accueil/recherche.php?cat=<?php echo $res['cat']; ?>&sous_cat=0"><?php echo $res['nom']; ?></a></dt>
<?php
echo'<dd id="smenu'.$res['cat'].'">';
echo'<ul>';
	  $req1 = mysql_query("SELECT sous_categorie.nom, sous_categorie.id AS sous_cat, count(article.id) as total FROM sous_categorie LEFT JOIN article ON sous_categorie.id=article.sous_categorie WHERE sous_categorie.id_parent='".$res['cat']."' GROUP BY sous_categorie.nom  ORDER BY sous_categorie.nom ASC") or die(mysql_error());
	  while($res1 = mysql_fetch_assoc($req1)){
	  echo'<li><img src="../images/puce_.png" alt="" />&nbsp;<a href="../accueil/recherche.php?cat='.$res['cat'].'&sous_cat='.$res1['sous_cat'].'">'.$res1['nom'].'</a></li>';
	  }
echo'</ul>';
echo'</dd>';
}
</dl>


J'ai beau retourner le problème dans tous les sens, je ne vois pas pourquoi ça ne fonctionne pas.
Merci de votre aide.
Modifié par arnold002 (29 Apr 2008 - 08:37)
Bonjour arnold002,

<script type="text/javascript">
<!--
window.onload=montre;
function montre(id) {
var d = document.getElementById(id);
	for (var i = 1; i<=[#red]30[/#]; i++) {
		if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
	}
if (d) {d.style.display='block';}
}
//-->
</script>


Devrait régler ton problème.

A part cela :
1/Il n'y a pas de déclaration d'encodage...
2/Tes puces devraient se trouver dans ta feuille de styles non ?
3/<dd id="smenuX"><ul></ul> ne sert pas à grand chose à mon avis...
4/Comme mentionné en préambule:
a écrit :
Préambule : ce tutoriel est estampillé "délicat"; Il ne doit pas être considéré comme une référence en la matière car il comporte certains problèmes intrinsèques


En attendant que le " l'adorable petit mammifère marsupial arboricole de l’hémisphère Sud" trouve un peu de temps pour finaliser un nouveau menu, tu pourras éventuellement te tourner vers le menu accordeon :
http://css.alsacreations.com/Tutoriels-JavaScript/Creer-un-menu-accordeon-avec-jQuery

Cdt,
Sylvain
Bonjour Sylvain,

Merci beaucoup de ta réponse qui me satisfait pleinement.
J'ai effectué la modif, et effectivement, le problème est résolu.
Pour l'encodage, j'ai oublié de le remettre sur ma page test mais je le déclare bien sur mes autres pages du site

<meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />

Merci aussi pour le lien. Le menu a l'air pas mal du tout. Je vais étudier cela de prêt (connais pas jQuery Smiley langue )
Bonne journée à toi