ordre d'affichage / masquage fonctions Javascript

Version imprimable

Bonjour à tous.

J'ai 2 fonctions en javascript qui me permettent d'afficher un div puis de le cacher.

voici le code :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 function ShowDiv(id){ if(document.getElementById(id).className=='hide'){ document.getElementById(id).className=''; $('#'+id).show('slow') } else { document.getElementById(id).className='hide'; $('#'+id).hide('slow') } } function HideDiv(id){ if(document.getElementById(id).className!='hide'){ document.getElementById(id).className='hide'; $('#'+id).hide('slow') } }
Les 2 fonctions marchent bien mais quand j 'ai ma liste de lien par exemple :

foot-----hand------basket------etc.....

En cliquant sur foot par exemple mon div s'affiche et ensuite je voudrai que lorsque je click sur hand il me ferme d'abord le div correspondant au foot.

J'ai fait avec un onblur mais le probleme est que en cliquant n'importe où ca me ferme le div. On ne peut meme pas faire de copier coller par exemple.

Voila j'espere que quelqu'un pourra m'aider.... Merci d'avance

19/03/2008, 09h47
jln13

salut,

tu peux faire un hide sur ton foot et le div du foot sur l'evenement onmouseout.

Sinon tu peux faire une fonction hideAll() qui cache toutes les div et tu l'appelle au debut de ta fonction ShowDiv().

j ai essayer de faire ceci mais ca ne marche pas.

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
 
 function sssShowDiv(id){
 
  		  if(document.getElementById(id).className!='hide'){
		  document.getElementById(id).className='hide';
		  $('#'+id).hide('slow')
			   }
		  if(document.getElementById(id).className=='hide'){
		  document.getElementById(id).className='';
		  $('#'+id).show('slow')
		  }
		  else
 
		  {
		  document.getElementById(id).className='hide';
		  $('#'+id).hide('slow')
		  }
 
		  }

une idée ?

19/03/2008, 12h29
jln13
Premiere remarque :

tu as deux if suivi d'un else. Vu les tests que tu fais il ne rentrera jamais dans le else. Illustration :
- cas "className != hide" :
- il rentre dans le premier test
- il met le className a 'hide'
- du coup il rentre dans le deuxieme if (donc rentre pas dans le else)
- cas className == hide :
- il ne rentre pas dans le premier if
- il rentre dans le 2eme if (donc rentre pas dans le else)

Ensuite, je repete ce que j'ai dit dans mon post precedent :
Tu appelles une fonction hideAll() au debut de ta fonction sssShowDiv() qui cache tous tes menus. Et ensuite tu affiche le menu dont tu as passe l'id en parametre. Ca t'enleve encore un test du coup ! O_ô'
19/03/2008, 14h25
figatelliSTI

merci beaucoup mais je ne sais pas comment faire pour fermer tous les élements.

Le code que j'ai je l ai pris et adapter c'est tout

j ai trouver une solution barbare mais bon :

onclick="sssHideDiv('hand'); sssHideDiv('basket'); sssShowDiv('foot');" >

le probleme est que si j ai 30 liens je vais devoir faire 30 copier coller
19/03/2008, 14h44
jln13

Ah vi c'est sur mais au moins t'as compris ! :)

après tu as plusieurs solutions pour faciliter l'ajout de nouveaux menus :
1) tu crées tes menus en menu1 menu2 menu3 au lieu de hand basket foot etc.. et tu as besoin d'une variable t'indiquant le nombre de menus.

2) si tu veux garder tes noms hand basket etc je te conseillerai alors de les renommer en : menu_hand menu_basket menu_foot etc..
Du coup tu récupères toutes les div par un getElementsByTagName() puis tu teste si la div est une div du menu par un substr(0,5) sur l'id pour savoir si c'est une div du menu. Du coup t'as pas besoin de connaitre le nombre de menus que tu as. Faut juste faire attention a pas nommer "menu_blabla" une div qui fait pas partie du menu mais bon ça se fait bien :)

J'espère avoir été clair...