comment afficher d'autres ligne en cliquant sur un lien

function Suite(lien){

var objet = document.getElementById('popup'); // entre les deux ' tu mes le nom du div que tu veux faire apparaître !

if(objet.style.display == "none" || !objet.style.display){

objet.innerHTML = "Ici le text que tu veux faire apparaître !";

objet.style.display = "block";

objet.style.overflow = "hidden";

lien.innerHTML = "-";

var hFinal = 200; //Hauteur finale (la hauteur une fois que ça aura fini de déplier !)

var hActuel = 0; //Hauteur initiale (la hauteur dès le début !)

var timer;

var fct = function ()

{

hActuel += 20; //Augmente la hauteur de 20px (tu peux modifier) tous les 40ms !

objet.style.height = hActuel + 'px';

if( hActuel > hFinal)

{

clearInterval(timer); //Arrête le timer

objet.style.overflow = 'inherit';

}

};

fct();

timer = setInterval(fct,40); //Toute les 40 ms

}else if(objet.style.display == "block"){

var hFinal = 0; //Hauteur finale (la hauteur une fois que ça aura fini de déplier !)

var hActuel = 200; //Hauteur initiale (la hauteur dès le début !)

var timer;

var fct = function ()

{

hActuel -= 20; //Augmente la hauteur de -20px (tu peux modifier) tous les 40ms !

objet.style.height = hActuel + 'px';

if( hActuel < hFinal)

{

clearInterval(timer); //Arrête le timer

objet.style.overflow = 'inherit';

objet.style.display = "none";

}

};

fct();

timer = setInterval(fct,40); //Toute les 40 ms

lien.innerHTML = "+";

}

}

</script>

HTML:

<table cellpadding="0" cellspacing="0" width="900" border="1" style="border:none" align="center">

<tr>

<td></td>

<td>Compteur</td>

<td>D&eacute;signation</td>

<td>Index</td>

<td style="border:none">&nbsp;</td>

<td colspan="4">Conso <i>(en Kwh)</i></td>

<!--<td></td><td></td>-->

</tr>

<tr><td></td><td colspan="4" style="border:none"></td><td>N-1</td><td>R</td></tr>

<tr bgcolor="#66CCFF">

<td><b>[<a href="javascript:;" onclick="Suite(this)">+</a>]</b></td>

<td>771</td>

<td>ELINKA - Salle Informatique</td>

<td><input type="text" name="index1" id="text" size="15" style="font-size:11px;"></td>

<td style="border:none;background-color:white">&nbsp;</td>

<td>9500</td><td>9800</td>

</tr>

<tr><td colspan="9">

<div id="popup" style="display: none; width: 900px;">

<table cellpadding="0" cellspacing="0" width="900" border="1" style="border:none" align="center">

<tr bgcolor="#66CCFF">

<td><b></b></td>

<td>771</td>

<td>ELINKA - Salle Informatique</td>

<td><input type="text" name="index1" id="text" size="15" style="font-size:11px;"></td>

<td style="border:none;background-color:white">&nbsp;</td>

<td>9500</td><td>9800</td>

</tr>

</table>

</div>

<tr bgcolor="#66CCFF">

<td><b>[<a href="javascript:;" onclick="Suite(this)">+</a>]</b></td>

<td>949</td>

<td>ELINKA - Bureaux</td>

<td><input type="text" name="index2" id="text" size="15" style="font-size:11px;"></td>

<td style="border:none;background-color:white">&nbsp;</td>

<td><div id="calque1">9500</div></td><td>9800</td><!--style="visibility:hidden"-->

</tr>

</table>


merci d'avance pour vos reponses.