Salut à tous,

Hier, grâce à Tiller, j'ai réussi à faire un petit système qui affiche les commentaires d'une news sur mon site en augmentant progressivement sa taille.
Cependant, j'ai voulu rajouter "ajouter un commentaire" qui permettrais alors d'ajouter un commentaire et viendrais remplacer le div contenant les commentaires par celui permettant d'écrire.

Le problème, c'est que je n'arrive pas à refermer ce div, ça ne referme que l'autre...

J'aimerai votre aide pour déjà savoir si je ne pourrais pas simplifier le système de base, et ainsi faire en sorte que je puisse fermer le deuxième div.

Voilà mes fonctions :

function getcom(id, i) {
if(!isNaN(id)) document.getElementById('c' + id).style.height = '0px';
else  { 
	var reg = /c/;
	var str = id;
	var newid = str.split(reg);
	document.getElementById(parseInt(newid[1]), 10).style.height = '0px';
}
	var ob = document.getElementById(id);
	i += 4;
				
	ob.style.height = i + "px";
				
	if (ob.offsetHeight < ob.scrollHeight) {
	setTimeout(function() {
	getcom(id, i);
	}, 10);
}
}
			
function hidecom(id, i) {
	var ob;
	if(i < document.getElementById('c' + id).style.height)
		ob = document.getElementById('c' + id);
	else
		ob = document.getElementById(id);
	i -= 4;
				
					
	ob.style.height = i + "px";
							
	if (i > 0) {
		setTimeout(function() {
			hidecom(id, i);
		}, 10);
	}
}

Et comment je les appelle

<h4 id="h0">

	<span style="float:left;" onclick="getElementById('h0').style.backgroundImage='url(images/comment.png)';">
		<a href="javascript:hidecom('0', parseInt(document.getElementById('0').style.height, 10));">
			cacher
		</a>
	</span>
	<span onclick="getElementById('h0').style.backgroundImage='url(images/commenth.png)';">
		<a href="javascript:getcom('c0', 0);">
			ajouter un commentaire
		</a>
		 - 
		<a href="javascript:getcom('0', 0);">

			pas de commentaire
		</a>
	</span>
</h4>

J'espère que vous saurez m'aider, merci beaucoup d'avance

J'ai absolument rien compris.

Et dans mon code je n'ai jamais mis truc.style.height mais parseInt(truc.style.height, 10)

style.height renvoi une string et non un integer

Et du javascript dans un href avec javascript: c'est moche

Et file le code généré, pas le code php, osef du php.

Voilà, j'ai remplacé le php, désolé...
Pourquoi je devrais pas mettre de javascript dans href ?
Il vaut mieux utiliser un <a onclick=""> ? C'était surtout pour pas avoir à mettre de #...

Pour ce que je veux faire, c'est comme avant, dérouler un div quand je clique sur mon lien, mais en dérouler un autre à la place quand je clique sur le lien d'à côté.
Et enfin pouvoir refermer, que ce soit l'un, ou l'autre en cliquant sur cacher.

Apparemment je m'y suis mal pris...

Merci de ton aide en tout cas.

J'en suis là sinon : http://radioseed.comxa.com/v2/

function getcom(id, i) {
	var ob = document.getElementById(id);
	i++;
	
	ob.style.height = i + "px";
	
	if (ob.offsetHeight < ob.scrollHeight) {
		setTimeout(function() {
			getcom(id, i);
		}, 10);
	}
}


function hidecom(id, i) {
	var ob = document.getElementById(id);
	if (!i) { var i = parseInt(ob.style.height, 10); }
	i--;
				
	ob.style.height = i + "px";
				
	if (i > 0) {
		setTimeout(function() {
			hidecom(id, i);
		}, 10);
	}
}

<h4 id="h0">

	<span style="float:left;" onclick="getElementById('h0').style.backgroundImage='url(images/comment.png)';">
		<button onclick="hidecom('0'); hidecom('c0');">
			cacher
		</button>
	</span>
	<span onclick="getElementById('h0').style.backgroundImage='url(images/commenth.png)';">
		<button onclick="getcom('c0', 0);">
			ajouter un commentaire
		</button>
		 - 
		<button onclick="getcom('0', 0);">

			pas de commentaire
		</button>
	</span>
</h4>

Ah merci
Mais, comment faire pour que quand je clique sur <ajouter un commentaire>, après avoir à cliqué sur <pas de commentaire>, pour que le div#0 soit refermé.

Enfin je veux dire pour que les deux divs ne soient pas ouverts en même temps.

Merci

<h4 id="h0">

	<span style="float:left;" onclick="getElementById('h0').style.backgroundImage='url(images/comment.png)';">
		<button onclick="hidecom('0'); hidecom('c0');">
			cacher
		</button>
	</span>
	<span onclick="getElementById('h0').style.backgroundImage='url(images/commenth.png)';">
		<button onclick="getcom('c0', 0); hidecom('0');">
			ajouter un commentaire
		</button>
		 - 
		<button onclick="getcom('0', 0); hidecom('c0');">

			pas de commentaire
		</button>
	</span>
</h4>

Merci beaucoup, ça marche.
Une dernière chose, comment augmenter la vitesse d'ouverture des divs, même quand je baisse le setTimeout à 1, ça reste lent.
Et le fait de mettre i+=4 (la vitesse qui m'intéresse au départ) n'est pas toujours concluant... Le div ne se referme pas toujours entièrement.

function getcom(id, i) {
	var ob = document.getElementById(id);
	i += 4;
	
	ob.style.height = i + "px";
	
	if (ob.offsetHeight < ob.scrollHeight) {
		setTimeout(function() {
			getcom(id, i);
		}, 10);
	}
}


function hidecom(id, i) {
	var ob = document.getElementById(id);
	if (!i) { var i = parseInt(ob.style.height, 10); }
	i -= 4;
				
	ob.style.height = i + "px";
				
	if (i > 0) {
		setTimeout(function() {
			hidecom(id, i);
		}, 10);
	}
}

Avec ce code il ne se ferme pas entièrement? Oô

Sinon essaie :

function hidecom(id, i) {
	var ob = document.getElementById(id);
	if (!i) { var i = parseInt(ob.style.height, 10); }
	i -= 4;
				
	ob.style.height = Math.max(0, i) + "px";
				
	if (i > 0) {
		setTimeout(function() {
			hidecom(id, i);
		}, 10);
	}
}

Ah, merci beaucoup, là ça marche !

Merci encore !

Utilises des button et pas des <a> qui ne sont pas fait pour sa !

En css tu mets:

button { background: none; border: none; }

Et roulez jeunesse.

Ah ouai okay merci, j'y ai même pas pensé xD
Merci encore.