Jquery faire apparaitre une div au clic

[Résolu/Fermé]
Signaler
Messages postés
449
Date d'inscription
jeudi 23 août 2007
Statut
Membre
Dernière intervention
26 avril 2012
-
Messages postés
449
Date d'inscription
jeudi 23 août 2007
Statut
Membre
Dernière intervention
26 avril 2012
-
Bonjour,

je cherche comment je pourrais faire apparaitre/disparaitre une div sur ma page web quand je clique sur un certain bouton.
Cette div doit apparaitre et disparaitre sur la gauche de l'écran.
Quelqu'un connait une solution?


3 réponses

Voili Voilou :

<html>
<head>
<script type="text/javascript">

function toggle(anId)
{
node = document.getElementById(anId);
if (node.style.visibility=="hidden")
{
// Contenu caché, le montrer
node.style.visibility = "visible";
node.style.height = "auto"; // Optionnel rétablir la hauteur
}
else
{
// Contenu visible, le cacher
node.style.visibility = "hidden";
node.style.height = "0"; // Optionnel libérer l'espace
}
}

</script>
</head>
<body>
<h1>Titre </h1>
<p>Contenu précédant </p>
<a href="#" onclick = "toggle('foo')">Cliquer pour basculer l'état du div suivant</a>
<!-- L'identificateur id du div doit être unique. Içi, "foo" ou "bar" ou autre, mais unique dans le document-->
<div id="foo">Ce contenu est visible ou non selon le cas</div>
<p>Contenu suivant </p>
</body>
</html>
1
Merci

Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire

CCM 42584 internautes nous ont dit merci ce mois-ci

Sinon tu peux utiliser une autre fonction :

function archives(id)

{

var archive=document.getElementById(id).style;



if(archive.display=='block'){

archive.display='none';

} else {

archive.display='block';

};

}
1
Merci

Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire

CCM 42584 internautes nous ont dit merci ce mois-ci

Ce code nécessite un double clic pour l'activer !!
Voili Voilou (sans le double clic) :

<html>
<head>
<script type="text/javascript">

function archives(id)
{
var archive=document.getElementById(id).style;
if((archive.display=='block') | (archive.display=='')){
archive.display='none';
} else {
archive.display='block';
};
}

</script>
</head>
<body>
<h1>Titre </h1>
<p>Contenu précédant </p>
<a href="#" onclick = "archives('foo')">Cliquer pour basculer l'état du div suivant</a>
<!-- L'identificateur id du div doit être unique. Içi, "foo" ou "bar" ou autre, mais unique dans le document-->
<div id="foo">Ce contenu est visible ou non selon le cas</div>
<p>Contenu suivant </p>
</body>
</html>
Messages postés
449
Date d'inscription
jeudi 23 août 2007
Statut
Membre
Dernière intervention
26 avril 2012
123
Merci beaucoup pour tes réponses :)
j'ai trouvé un autre moyen mais je garde ton code sous la main au cas ou ;)