fonction switch Div

Bonjour a vous,

Je viens a vous pour vous exposez mon problèmes j’espère être assez explicite.
Merci d'avance pour vos réponses.

Donc j'ai plusieurs div avec une ID de 1 a 31 qui s'affiche si leurs conditions sont respecté.Mon soucis c'est que généralement toute les div ne sont pas afficher vu que chacune a des conditions propres.

Et l'utilisation de case oblige a avoir toute les div présente auriez vous une solution ?

Contexte :

Je clique sur le lien

Code:

---

<a onclick="switchDiv({i})"><img border="0" src="{dpath}gebaeude/batiment/{i}.png" align="top" width="100" height="100"></a>

---

Cela affiche donc

Code:

---

<div class="baliseDiv" style="display:none;position:absolute;width:190px;margin-top:-110px;left:16.5%;text-align:center" id="{i}"><a href="index.php?page=infos&gid={i}"><img border="0" src="{dpath}gebaeude/batiment/{i}.png" align="top" width="120" height="120"><br><br></a><a href="index.php?page=infos&gid={i}">{n}</a>{nivel}<br>{descriptions}<br>{price}{time}{rest_price}<td class="k">{click}</td></div>

---

Et au clic de l'autre lien celui ci disparait et apparait l'autre div.

J'ai donc ce code :

JavaScript :

Code:

---

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

function switchDiv(n) { var id; switch(n) { case 0:id = "";break; case 1:id = "1";break; case 2:id = "2";break; case 3:id = "3";break; case 4:id = "4";break; case 12:id = "12";break; case 14:id = "14";break; case 15:id = "15";break; case 20:id = "20";break; case 21:id = "21";break; case 22:id = "22";break; case 23:id = "23";break; case 24:id = "24";break; case 31:id = "31";break; }   document.getElementById('1').style.display = "none"; document.getElementById('2').style.display = "none"; document.getElementById('3').style.display = "none"; document.getElementById('4').style.display = "none"; document.getElementById('12').style.display = "none"; document.getElementById('14').style.display = "none"; document.getElementById('15').style.display = "none"; document.getElementById('20').style.display = "none"; document.getElementById('21').style.display = "none"; document.getElementById('22').style.display = "none"; document.getElementById('23').style.display = "none"; document.getElementById('24').style.display = "none"; document.getElementById('31').style.display = "none";   if (id!="") document.getElementById(id).style.display = "block"; } //-->

---

HTML :

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14

<ul style="float:left"><a onclick="switchDiv({i})"> <img border="0" src="{dpath}gebaeude/batiment/{i}.png" align="top" width="100" height="100"> </a> <div class="baliseDiv" style="display:none;position:absolute;width:190px;margin-top:-110px;left:16.5%;text-align:center" id="{i}"> <a href="index.php?page=infos&gid={i}"> <img border="0" src="{dpath}gebaeude/batiment/{i}.png" align="top" width="120" height="120"><br><br> </a> <a href="index.php?page=infos&gid={i}">{n}</a>{nivel}<br> {descriptions}<br> {price} {time} {rest_price} <td class="k">{click}</td> </div></ul>

---

J’espère que mon problèmes a était exposer clairement je vous remercie.

Ca serait pas un userscript Ogame par hasard ? "gebaeude/batiment/" ça me rappelle mes tous premiers scripts :P

Pour ton problème, s'il s'agit juste de réduire la taille du code, tu peux sélectionner toutes les div à cacher en te servant d'autre chose que l'ID, par exemple la classe baliseDiv (très mal nommée au passage).

Code:

---

1 2 3 4

var divs = document.querySelectorAll("div.baliseDiv"); for(var i=0; i<divs.length; i++){ divs[i].style.display="none"; }

---