Soucis pour 'désafficher'

24 janvier 2009 à 14:09:49

Yop all, j'aimerais faire un système simple je pense.
On a une div avec une image et le nom.

En cliquant un premier coup dessus, les stats s'affichent, un second coups, elle reviens à l'état initial.

Je ne sais pas comment m'y prendre :s

Voici le css de base :

<style>
	#DivOne
	{
	background-color:black;
	color:white;
	width:10%;
	height:120px;
	}
	
	.center
	{
	text-align:center;
	}
	
	</style>

Voici ma fonction :

<script type="text/JavaScript">
	function OnDivUp(animated)
	{
		//1er click
		document.getElementById('DivOne').style.cssText="width:10%;height:120px;";
		animated.innerHTML='<div class="center"><img src="fond.png" /></div>';		

		//2nd click
		document.getElementById('DivOne').style.cssText="width:10%;height:180px;";
		animated.innerHTML='<div class="center"><img src="fond.png" /></div>Empereur<br />ATK : 50<br />DEF : 30<br />VIE : 10<br />';

	}
	</script>

voici ma page en elle même :

<body>
       <p>Présentation de la fonction OnDivUp :</p><br />
	   
	   <div id="DivOne" onclick="OnDivUp(this)">
			<div class="center"><img src="fond.png" /></div>
			Empereur
			
	   </div>
	   
   </body>

(Je me fais un répertoire avec les fonctions que j'aurais besoin plus tard, comme ça je ne fais pas que du php).

Merci d'avance =)

Anonyme

24 janvier 2009 à 14:17:42

Tient, j'avais proposé un code comme tu le veux ici : http://www.siteduzero.com/forum-83-361970-p1-hidden.html

Tu mets le contenu dans un div et le tour est joué
A+

anerax

24 janvier 2009 à 14:20:59

Ok thx, je ne savais pas qu'on pouvais tester si il y avais un display none ou pas

EDIT : Je ne comprend pas comment elle marche ><
EDIT 2 : En fait j'ai même pas compris en quoi ça peut m'aider U_u"

Anonyme

24 janvier 2009 à 14:27:52

Ouais tu utilises pas le même systéme mais bon je me suis dit au cas ou ..

Ben là tu testes si il y a du contenu et si oui tu vides, sinon tu rajoutes

anerax

24 janvier 2009 à 15:16:00

Oui mais le soucis c'est que dans tous les cas il y a du contenu :s

EDIT : J'ai réussis =)

<script type="text/JavaScript">
	function OnDivUp(animated)
	{
		if(animated.style.height!='120px')
		{
			//1er click
			document.getElementById('DivOne').style.cssText="width:10%;height:120px;";
			animated.innerHTML='<div class="center"><img src="fond.png" /></div>Empereur';		
		}
		else
		{
			//2nd click
			document.getElementById('DivOne').style.cssText="width:10%;height:180px;";
			animated.innerHTML='<div class="center"><img src="fond.png" /></div>Empereur<br />ATK : 50<br />DEF : 30<br />VIE : 10<br />';
		}
	}
	</script>