Afficher/cacher des div en JS
Résolu
JS-div
-
conseil198 Messages postés 51 Date d'inscription Statut Membre Dernière intervention -
conseil198 Messages postés 51 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
Je suis confronté au problème suivant;
J'ai deux div (qui contiennent un include en PHP) qui doivent être affichés (soit l'un soit l'autre) en fonction de l'image sur laquelle l'on presse. En arrivant sur la page ces containers sont masqués ... Malgré mes nombreuses tentatives, je n'y parvient pas ... Pourriez-vous m'aider ?
Voici mon script JS :
Et dans le body j'ai les deux images :
Et à l'endroit où doivent s'afficher les containers :
Pour info : Si j'écris directement "block" dans le style du <div>, ça fonctionne !
Ou est-ce que je fait faux ? Manque-t-il quelque chose ?
Merci !
Je suis confronté au problème suivant;
J'ai deux div (qui contiennent un include en PHP) qui doivent être affichés (soit l'un soit l'autre) en fonction de l'image sur laquelle l'on presse. En arrivant sur la page ces containers sont masqués ... Malgré mes nombreuses tentatives, je n'y parvient pas ... Pourriez-vous m'aider ?
Voici mon script JS :
<script>
function image1()
{
document.getElementById("page1").style.display="block";
document.getElementById("page2").style.display="none";
}
function image2()
document.getElementById("page1").style.display="none";
document.getElementById("page2").style.display="block";
}
</script>
Et dans le body j'ai les deux images :
<a onClick="image1();"><img src="image1.png"></a> <a onClick="image2();"><img src="image2.png"></a>
Et à l'endroit où doivent s'afficher les containers :
<div id="page1" style="display:none;" >
<?php include('chemin/mapage1.php'); ?>
</div>
<div id="page2" style="display:none;" >
<?php include("chemin/mapage2.php"); ?>
</div>
Pour info : Si j'écris directement "block" dans le style du <div>, ça fonctionne !
Ou est-ce que je fait faux ? Manque-t-il quelque chose ?
Merci !
A voir également:
- Afficher/cacher des div en JS
- Afficher appdata - Guide
- Cacher son numéro - Guide
- Cacher conversation whatsapp - Guide
- Cacher ses amis sur facebook - Guide
- Application pour cacher des applications - Guide
3 réponses
salut,
<script type="text/javascript">
function afficher_div(image)
{
switch(image){
case 'image1':
document.getElementById("page1").style.display="block";
document.getElementById("page2").style.display="none";
break;
case 'image2':
document.getElementById("page2").style.display="block";
document.getElementById("page1").style.display="none";
break;
}
}
</script>
Et dans le body j'ai les deux images :
<!-- si tu as 50 images tu ne vas pas faire 50 fonctions, alors utilises une seule fonction et passes lui en argument le nom de l'image cliquée -->
<a href="javascript:afficher_div('image1');"><img src="image1.png"></a>
<a href="javascript:afficher_div('image2');"><img src="image2.png"></a>
Et à l'endroit où doivent s'afficher les containers :
<div id="page1" style="display:none;" >
<?php include('chemin/mapage1.php'); ?>
</div>
<div id="page2" style="display:none;" >
<?php include("chemin/mapage2.php"); ?>
</div>