Discussion :

[Mister Paul]

Bonjour,

j'ai fait un menu simple (1 seul niveau de sous-menu) en CSS.

Je voudrais que le sous-menu soit déplié quand les pages php correspondantes sont ouvertes.
J'ai donc ajouté dans le header de ces pages :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
<!-- Sous-menu déplié -->		
<style type="text/CSS">
#menu ul li ul {
 	visibility: visible; 
	color: #a0a0a0;
 }
</style>

Le problème c'est que bien sûr tous les sous-menus se retrouvent dépliés...


Comment n'avoir que celui correspondant déplié ?

Merci
PAul

[Bovino]

Tu peux par exemple ajouter un identifiant ou une classe spécifique en PHP pour déterminer quel est le sous menu à afficher dans la page.

[Mister Paul]

Merci. J'ai créé une classe "ouvert" qui rend visible le sous-menu quand l'utilisateur visualise une page à ce niveau.

Mais je découvre un autre problème :
une fois un sous-menu affiché, si l'utilisateur fait un rollover sur un autre sous-menu alors mes 2 sous-menus se chevauchent car ils sont tous les 2 visibles et s'affichent sur la même zone de la page (mes menus et sous-menus sont horizontaux).

Comment s'en sortir ?
Peut-être une moyen de changer l'état de la classe "ouvert" lors d'un hover sur un #menu ul li ul ?

[Mister Paul]

Argh... je sens que ça n'est pas possible...

[Mister Paul]

Bon j'ai peut-être été confus aussi… alors des images parlent sans doute mieux :

1° voilà mon sous-menu ouvert avec la classe "ouvert" qui rend visible le sous-menu quand l'utilisateur visualise une page à ce niveau. Ici on est sur la page "Sous item 1":
http://cjoint.com/data/0lhilPdBsca.htm

2° si on fait un rollover sur un élément du menu qui a un sous-menu voilà se qui arrive. Ici un rollover sur "Item 3" :
http://cjoint.com/data/0lhiolSGVPB.htm


Comment gérer ça ? Avec du javascript ???