Sous menu qui se referme lors d'un clique

**sissi25** · 12/06/2008, 20h07

Débutante en javascript, j'ai réalisé un petit menu avec un systeme de plus et de moins pour ouvrir les sous menu

Voici mon code :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
 
<table>	
	<tr >
		<td>
			<div id="menu">
				<div id="menu_Admin" >
					<img src="minus.gif" onClick="hide('ss_Admin','menu_Admin','plus_Admin','moins_Admin');" style="display: none"/>
					<img src="plus.gif" onClick="show('ss_Admin','menu_Admin','plus_Admin','moins_Admin');" style="display: inline"/>
					Admin
				<div id="ss_Admin">
						<div><a>Identification</a></div>
					<div><a>Nouveau compte</a></div> 
				</div>

et le javascript associé :

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
 
function show(id,id2,img,img2){
 
	document.getElementById(id).style.display='block';
	var h = document.getElementById(id).offsetHeight+document.getElementById(id2).offsetHeight;
	var navigateur = navigator.appName;
	if(navigateur == "Netscape")document.getElementById(id2).style.height = h+'px';
	document.getElementById(img).style.display='none';
	document.getElementById(img2).style.display='inline';
}
 
function hide(id,id2,img,img2){
 
	document.getElementById(img).style.display='inline';
	document.getElementById(img2).style.display='none';
	var h = document.getElementById(id).offsetHeight;
	document.getElementById(id).style.display='none';	
	var hb = document.getElementById(id2).offsetHeight-h;
	document.getElementById(id2).style.height = hb+'px';
}

Le probleme est lorsque que je clique sur un lien par exemple Nouveau Compte, le sous menu Admin se referme

Comment faire pour éviter cela ?

Merci d'avance pour votre aide

**htr999** · 12/06/2008, 20h38

essaie cela, sinon JQuery est super pour ça ...

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
<head>
<style>
a { text-decoration: none; }
a:hover { text-decoration: underline; }
ul {
	margin-top: 0px;
	margin-bottom: 0px;
	padding-left: 20px;
}
</style>
<script>
function affiche(id) {
	document.getElementById(id).style.display = (document.getElementById(id).style.display == "none")? "block" : "none";
}
</script>
</head>
 
<body>
<a href="javascript:affiche('menu1');">Menu1</a>
<ul id="menu1" style="display: none;">
	<li>Menu1.1</li>
	<li>Menu1.2</li>
</ul><br />
<a href="javascript:affiche('menu2');">Menu2</a>
<ul id="menu2" style="display: none;">
	<li>
		<a href="javascript:affiche('menu2.1');">Menu2.1</a>
		<ul id="menu2.1" style="display: none;">
			<li>Menu2.1.1</li>
			<li>Menu2.1.2</li>
		</ul>
	</li>
	<li>Menu2.2</li>
</ul><br />
</body>

Sous menu qui se referme lors d'un clique

JavaScript

Discussions similaires

Partager

Partager