par
Ryle » 15 mai 2007, 10:41
Au choix... dans un lien, il te suffit de préfixer par "javascript:" pour que le navigateur ne fasse pas une redirection, mais tu peux tout aussi bien faire ça lors d'un onClick sur un élément de ta page :
<a href="javascript:document.getElementById('id du div').style.visibility = 'visible';">Afficher</a>
Tu peux aussi faire appel à une fonction javascript pour tester si le div est visible ou non pour l'afficher ou le masquer avec un seul lien :
<a href="javascript:maFonction();">Afficher/Masquer</a>
<script language="javascript">
function maFonction() {
if (document.getElementById('id du div').style.visibility == 'visible') { // si le div est visible
document.getElementById('id du div').style.visibility = 'hidden'; // on le masque
}
else { // sinon
document.getElementById('id du div').style.visibility = 'visible'; // on l'affiche
}
}
</script>
Enfin, si tu ne veux pas laisser de "trou" dans ton code puisque l'attribut "visibility:hidden" ne fait que cacher l'élément sans le retirer, tu peux également utiliser l'attribut "display" avec les valeur "none" pour le cacher, ou "block" / "inline" pour l'afficher

Au choix... dans un lien, il te suffit de préfixer par "javascript:" pour que le navigateur ne fasse pas une redirection, mais tu peux tout aussi bien faire ça lors d'un onClick sur un élément de ta page :
[php]<a href="javascript:document.getElementById('id du div').style.visibility = 'visible';">Afficher</a>[/php]
Tu peux aussi faire appel à une fonction javascript pour tester si le div est visible ou non pour l'afficher ou le masquer avec un seul lien :
[php]<a href="javascript:maFonction();">Afficher/Masquer</a>
<script language="javascript">
function maFonction() {
if (document.getElementById('id du div').style.visibility == 'visible') { // si le div est visible
document.getElementById('id du div').style.visibility = 'hidden'; // on le masque
}
else { // sinon
document.getElementById('id du div').style.visibility = 'visible'; // on l'affiche
}
}
</script>
[/php]
Enfin, si tu ne veux pas laisser de "trou" dans ton code puisque l'attribut "visibility:hidden" ne fait que cacher l'élément sans le retirer, tu peux également utiliser l'attribut "display" avec les valeur "none" pour le cacher, ou "block" / "inline" pour l'afficher :)