besoin
Vous avez peut être le besoin de faire disparaître des parties de votre page HTML, d’une façon ou d’une autre, généralement en cliquant sur un bouton ou un lien.
La partie est typiquement délimitée par <div id="partie"></div> ou par <span id="partie"></span>.
Suivant le résultat que l’on désire obtenir, deux options se présentent.
invisible mais présent
La zone "partie" est juste invisible, mais la surface occupée est toujours présente. Dans ce cas, c’est le style
visibility: hidden; qui est utilisé.
Les valeurs possibles sont
{hidden|visible}.
pas affiché
Ou bien alors, la zone "partie" est purement et simplement supprimée de l’affichage. Dans ce cas, c’est le style
display: none; qui est utilisé.
Les valeurs possibles sont
{none|block|inline}.
HTML
Donc, nous avons un texte, dont une partie doit être supprimée de l’affichage, au bon gré de l’utilisateur.
<a href="javascript:cachecache('partie');">Montrer ou cacher la zone partie</a>
bla bla bla
<div id="partie">
ligne cachée
</div>
bla bla bla
JavaScript
On aperçoit l’appel à une fonction Javascript cachecache(id_zone), qui prend un argument, l’identifiant de la zone à cacher ou à révéler.
<script type="text/javascript">
<!--
function cachecache(id_obj) {
var objet = document.getElementById(id_obj);
if (objet == null) {
return;
}
if (objet.style.display != 'none') {
document.getElementById(id_obj).style.display = 'none';
}
else {
document.getElementById(id_obj).style.display = 'block';
}
}
// -->
</script>
C’est aussi bête que ça.