bonjour tous le monde
je suis en train de d�velopper un site web mais un petit probl�me de design m'inqui�tait. j'esp�re que vous pouver m'aider
le probl�me est que j'ai un menu quand je clique sur l'un des menus principale les sous menu seront affich� et quand je clique sur un autre les sous menus de premier menu principal restent affich� et moi je veux �viter cette probl�me c'est � dire il faut que quand je clique sur le deuxi�me menu principal les sous menus de deuxi�me menu principale seront �vit� ou bien ne seront pas affich�.
le code html:
le code javaScript:
Code html : 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 <ul id="menu"> <li><a href="#" class="fa fa-pencil" style="color:rgba(0,0,0,0.7);"></a> <ul> <li> <div id="sous"> <textarea title="Exprimez-vous" placeholder="votre statut" cols="60"></textarea> <div id="btn"> <button class="submit" type="submit" style="margin-left: 251px">Publier</button> </div> </div> </li> </ul> </li> <li><a href="#" class="fa fa-camera" style="color:rgba(0,0,0,0.7);"></a> <ul> <li> <div id="sous"> <textarea title="Exprimez-vous" placeholder="description d'image" cols="60"></textarea> <div id="btn"> <input type="file" name="image" accept="image/*" value="Importer"> </div> <div id="btn"> <button class="submit" type="submit" style="margin-left: 251px">Publier</button> </div> </div> </li> </ul></li> <li><a href="#" class="fa fa-video-camera" style="color:rgba(0,0,0,0.7);"></a> <ul> <li> <div id="sous"> <textarea title="Exprimez-vous" placeholder="description d'image" cols="60"></textarea> <div id="btn"> <input type="file" name="video" accept="video/*" capture> </div> <div id="btn"> <button class="submit" type="submit" style="margin-left: 251px">Publier</button> </div> </div> </li> </ul></li></ul>
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 function DynamMenu(){ if(!document.getElementsByTagName) //On teste si on a le droit de faire mumuse avec le DOM sur les TAGNAME return; var Menu = document.getElementById('menu'); //On récupère le menu var li = Menu.getElementsByTagName('LI'); //On récupère tous les LI du menu for(var i=0; i<li.length-1; ++i) { //On scanne tous les LI var sousUL = li[i].getElementsByTagName('UL'); //Pour chaque LI on recupère le UL dessous if (sousUL[0]) { //On vérifié qu'il y a un UL dans le LI sousUL[0].id = 'sousmenu' + i; //On met un ID à ce UL sousUL[0].style.display = "none"; li[i].getElementsByTagName('A')[0].href= "javascript:ShowHideMenu('sousmenu" + i + "')"; } } } window.onload = DynamMenu; function ShowHideMenu(MenuId){ var SousMenu = document.getElementById(MenuId); if (SousMenu.style.display=='block' || SousMenu.style.display == null) { SousMenu.style.display = 'none'; //ON cache le sous menu } else{ SousMenu.style.display = 'block'; //On affiche le sous menu } }
Partager