Discussion :

[seraphins]

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 html :

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

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

Cela affiche donc

Code html :

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

<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 :

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
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 html :

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

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.

[SylvainPV]

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

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 :

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

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