Avec le JS, comment faire pour voir et cacher
Résolu
jlb59
Messages postés
343
Date d'inscription
Statut
Membre
Dernière intervention
-
divina -
divina -
Bonjour à tous,
Comme j'essaie de faire une FAQ, il serait fort intéressant pour moi, surtout pour la longueur de la page, de faire afficher au click de la souris la réponse à la question posée, et la cacher s'il y a un second click sur la question.
J'espère bien me faire comprendre.
Un exemple :
Pourquoi tous les chiens aboient ?
Parce qu'ils ne veulent pas qu'on les prenne pour des chats.
Ce que je souhaiterais faire, c'est afficher la réponse en cliquant sur la question, et la cacher au 2ème clic.
J'ai vu les évènements onclick, onmouse, etc., mais je n'arrive pas à faire cela.
Alors, je voulais savoir si c'est possible et si oui, comment faire ?
Merci de votre aide.
Comme j'essaie de faire une FAQ, il serait fort intéressant pour moi, surtout pour la longueur de la page, de faire afficher au click de la souris la réponse à la question posée, et la cacher s'il y a un second click sur la question.
J'espère bien me faire comprendre.
Un exemple :
Pourquoi tous les chiens aboient ?
Parce qu'ils ne veulent pas qu'on les prenne pour des chats.
Ce que je souhaiterais faire, c'est afficher la réponse en cliquant sur la question, et la cacher au 2ème clic.
J'ai vu les évènements onclick, onmouse, etc., mais je n'arrive pas à faire cela.
Alors, je voulais savoir si c'est possible et si oui, comment faire ?
Merci de votre aide.
A voir également:
- Avec le JS, comment faire pour voir et cacher
- Comment voir qui regarde mon profil facebook - Guide
- Voir sa maison sur google street view - Guide
- Voir message supprimé whatsapp - Guide
- Comment voir qui regarde mon profil instagram - Guide
- Voir mot de passe wifi android - Guide
4 réponses
entre les balises <head> et </head> tu fais une fonction du type :
function montre_cache(id){
if(document.getElementById(id).style.visibility=='hidden'){
document.getElementById(id).style.visibility='visible';}else{
document.getElementById(id).style.visibility='hidden';}
}
et tu implémente le css suivant :
span.reponse{visibility:hidden;}
ensuite dans ton body tu créer une liste (<ul> </ul>) dans laquelle tu mets pour chaque question/reponse :
<li><span id="question_1" onClick="montre_cache('reponse_1');">Question</span>
<br /><span id="reponse_1" class="reponse">Reponse</span>
</li>
En esperant que cela fonctionne comme tu le souhaites,
Stephane.
function montre_cache(id){
if(document.getElementById(id).style.visibility=='hidden'){
document.getElementById(id).style.visibility='visible';}else{
document.getElementById(id).style.visibility='hidden';}
}
et tu implémente le css suivant :
span.reponse{visibility:hidden;}
ensuite dans ton body tu créer une liste (<ul> </ul>) dans laquelle tu mets pour chaque question/reponse :
<li><span id="question_1" onClick="montre_cache('reponse_1');">Question</span>
<br /><span id="reponse_1" class="reponse">Reponse</span>
</li>
En esperant que cela fonctionne comme tu le souhaites,
Stephane.
Bonjour ACNet,
Désolé de cet énorme retard mais j'était très pris ailleurs.
Merci pour tes bouts de codes, c'est exactement ça que je voulais faire.
Cela fonctionnera sous IE et FF ?
Je demande ça parce que j'ai eu pas mal de surprises !
Désolé de cet énorme retard mais j'était très pris ailleurs.
Merci pour tes bouts de codes, c'est exactement ça que je voulais faire.
Cela fonctionnera sous IE et FF ?
Je demande ça parce que j'ai eu pas mal de surprises !