Jquery faire apparaitre une div au clic
Résolu/Fermé
laurenzo17
Messages postés
450
Date d'inscription
jeudi 23 août 2007
Statut
Membre
Dernière intervention
26 avril 2012
-
16 juin 2011 à 10:14
laurenzo17 Messages postés 450 Date d'inscription jeudi 23 août 2007 Statut Membre Dernière intervention 26 avril 2012 - 16 juin 2011 à 12:46
laurenzo17 Messages postés 450 Date d'inscription jeudi 23 août 2007 Statut Membre Dernière intervention 26 avril 2012 - 16 juin 2011 à 12:46
A voir également:
- Jquery faire apparaitre une div au clic
- Apparaitre hors ligne instagram - Guide
- Apparaitre hors ligne whatsapp - Guide
- Div c++ - Télécharger - Langages
- Ne pas apparaître en ligne sur messenger pour une personne - Guide
- Atout clic - Télécharger - Éducatifs
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>
<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>
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';
};
}
function archives(id)
{
var archive=document.getElementById(id).style;
if(archive.display=='block'){
archive.display='none';
} else {
archive.display='block';
};
}
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>
<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>
laurenzo17
Messages postés
450
Date d'inscription
jeudi 23 août 2007
Statut
Membre
Dernière intervention
26 avril 2012
124
16 juin 2011 à 12:46
16 juin 2011 à 12:46
Merci beaucoup pour tes réponses :)
j'ai trouvé un autre moyen mais je garde ton code sous la main au cas ou ;)
j'ai trouvé un autre moyen mais je garde ton code sous la main au cas ou ;)
