Faire disparaitre et apparaitre un div?
amapic
-
amapic -
amapic -
Bonjour,
je voudrais faire apparaitre et disparaitre un div. j'ai mis style="display:none;" dans les options du div dans le codage de la page, ce qui fait que quand je lance le fichier html le div n'apparait pas. Afin de faire apparaitre le div j'appelle une fonction qui fait :
document.getElementById("departement").style.display = "block".
Il n'apparait alors que sous firefox. En IE il faut cliquer la ou le div est sensé etre pour que celui ci apparaisse.
Pour le refaire disparaitre, j'appelle une autre fonction qui fait :
document.getElementById("departement").style.display = "none";
mais la sur aucun navigateur le div ne disparait. Il reste la.
Comment puis je changer ca ? Par ajax?
je voudrais faire apparaitre et disparaitre un div. j'ai mis style="display:none;" dans les options du div dans le codage de la page, ce qui fait que quand je lance le fichier html le div n'apparait pas. Afin de faire apparaitre le div j'appelle une fonction qui fait :
document.getElementById("departement").style.display = "block".
Il n'apparait alors que sous firefox. En IE il faut cliquer la ou le div est sensé etre pour que celui ci apparaisse.
Pour le refaire disparaitre, j'appelle une autre fonction qui fait :
document.getElementById("departement").style.display = "none";
mais la sur aucun navigateur le div ne disparait. Il reste la.
Comment puis je changer ca ? Par ajax?
A voir également:
- Faire disparaitre et apparaitre un div?
- Apparaitre hors ligne instagram - Guide
- Comment faire apparaître la tabulation sur word - Guide
- Comment faire apparaître le curseur sans souris - Guide
- Apparaitre hors ligne whatsapp - Guide
- Comment faire apparaître le clavier sur iphone - Guide
4 réponses
<html>
<head>
<script type="text/javascript">
function test() {
document.getElementById('iddiv').style.display='block';
}
function test2() {
document.getElementById('iddiv').style.display='none';
}
</script>
<style type="text/css">
.div {
display : none;
}
</style>
</head>
<body>
<div id="iddiv" class="div">
<h1>HELLO WORLD</h1>
</div>
<input type="button" value="Apparaitre" name ="clic" onclick="test()" />
<input type="button" value="Disparaitre" name ="clic" onclick="test2()" />
</body>
</html>
Je viens de faire ça vite fait,pour moi y'as pas de souci.
Aprés je pense qu'il faut regarder au niveau du navigateur (doctype)
MERCI Lord zero pour ta réponse
Ton code marche mais je n'ai pas précisé que l'appel de fonction se fait sur le onchange d'une checkbox.
la fonction appelée lors du clic et déclic de la checbox est donc :
function afficheDepartement(){
if (document.getElementById("departement").style.display == 'none') {
document.getElementById("departement").style.display = 'block';
}
else
{document.getElementById("departement").style.display = 'none';
}
}
et la ca ne marche pas.
Je ne sais pas si vous avez une idée
Ton code marche mais je n'ai pas précisé que l'appel de fonction se fait sur le onchange d'une checkbox.
la fonction appelée lors du clic et déclic de la checbox est donc :
function afficheDepartement(){
if (document.getElementById("departement").style.display == 'none') {
document.getElementById("departement").style.display = 'block';
}
else
{document.getElementById("departement").style.display = 'none';
}
}
et la ca ne marche pas.
Je ne sais pas si vous avez une idée
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Untitled 1</title>
<script type="text/javascript">
function test3() {
if (document.getElementById("iddiv").style.display == 'block') {
document.getElementById("iddiv").style.display = 'none';
}
else
{document.getElementById("iddiv").style.display = 'block';
}
}
</script>
<style type="text/css">
.div {
display : none;
}
</style>
</head>
<body>
<div id="iddiv" class="div">
<h1>HELLO WORLD</h1>
</div>
<input name="Checkbox1" type="checkbox" onclick="test3()" />
</body>
</html>
Sur une checkbox je vois pas trop pourquoi tu met un onchange vu que pour qu'il y est un changement il doit y avoir un click
j'ai modifié le code avec ce que tu demande,enfin j'espère