Discussion :

[LOUSHEER]

Bonjour à tous,

j'ai utilisé dans la galerie CSS des menus verticaux le déroulant n°02

Le p problème est que le sous-menu apparaît bien mais disparaît aussitôt

Qui peut me donner la solution pour que mon sous menu reste apparent lorsque je clique sur mon menu

cordialement

mon site www.esquisse-beaute.com pour consulter mon code source

ci dessous la partie CSS de mon menu

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
#menu {
    width: 200px;
	float: left;
	font-family: arial;
	background: url(images/gauche.png) repeat;
	background: #8A3143;
	font-size: 16px;
 
}
 
.menu {
	padding: 5px 6px 5px 6px;
	color:#FFF;
}
 
.sousmenu {
	padding: 0px 15px 0px 6px;
	color:#FFF;
}
 
.menu a {
	display: block;
	width:90%;
	height:100%;
	text-decoration: none;
	color:#FFF;
	padding: 5px 6px 5px 6px;
}
 
.sousmenu a {
	display: block;
	width:90%;
	height:100%;
	text-decoration: none;
	color:#fff;
	padding: 0px 15px 0px 6px;
}
 
 
.menu a:hover, .sousmenu a:hover, .menu a:active, .sousmenu a:active, .menu a:focus, .sousmenu a:focus {
	background:#702736;
}

[ornitho13]

En fait ton sous menu ne disparaît pas vraiment. le souci est le suivant : quand tu cliques sur un menu, si il y a un sous menu, il apparaît mais en même temps cela charge la page du menu sur lequel tu as cliqué.

Le problème vient plutôt du javascript et de la fonction "afficheMenu(this)".

De plus dans ton menu, tu as 2 fois le même ID (menu7) et cela est interdit dans une page HTML

[LOUSHEER]

peut on résoudre le problème

le script que j'ai mis est le suivant:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
function afficheMenu(obj){
 
	var idMenu     = obj.id;
	var idSousMenu = 'sous' + idMenu;
	var sousMenu   = document.getElementById(idSousMenu);
 
	for(var i = 1; i <= 4; i++){
		if(document.getElementById('sousmenu' + i) && document.getElementById('sousmenu' + i) != sousMenu){
			document.getElementById('sousmenu' + i).style.display = "none";
		}
	}
 
	if(sousMenu){
		//alert(sousMenu.style.display);
		if(sousMenu.style.display == "block"){
			sousMenu.style.display = "none";
		}
		else{
			sousMenu.style.display = "block";
		}
	}
 
}

[NoSmoking]

c'est plus un problème de conception de ton menu qu'autre chose.

- mettre un petite image [+] en regard pour faire apparaître tes(ton) sous menus et [-] pour les masquer
- gérer dans la fonction afficheMenu si les sous menus sont affichés, et si existent, alors laisser l'action du lien se faire sinon l'annuler.

Ce genre de menu est le plus souvent traité avec des listes UL LI.