Vous ne trouvez pas de réponse à votre problème ? Alors posez la question dans le forum. Souvenez-vous qu'il n'y a jamais de question bête, mais rester dans l'ignorance parce que l'on n'ose pas poser une question, ça c'est une erreur !

Sujet : Besoin d'aide pour texte en accordéon [ CSS / Général ] (devoluti0n)

vendredi 13 juin 2008 à 18:45:15 | Besoin d'aide pour texte en accordéon

devoluti0n

Bonjour !

Je vous éxpose mon petit probleme :

J'éssaye de mettre en place une FAQ dont toutes les questions seront listés, et par clic sur ces questions, les réponses apparaitront en dessous.
Cela fonctionne trés bien à l'aide du code suivant :

Le javascript :

 function afficherPara(para)
 {
  if(document.getElementById(para).style.display == 'none')
   document.getElementById(para).style.display = 'block';
  else
   document.getElementById(para).style.display = 'none';
 }

Le html :

<DIV class="question" onclick="afficherPara('question1');">La question ??</DIV>
<DIV class="réponse" <P id="question1">
   La réponse....
</p></DIV>

Bref, j'aimerai savoir comment on peut faire pour que lorsque je clic sur une autre question, la quesiton précédente se referme...
Ca peut paraitre stupide mais je bloque.

Merci !!

samedi 14 juin 2008 à 10:31:15 | Re : Besoin d'aide pour texte en accordéon

bultez

Membre Club


Bonjour,
    mémorise dans une variable globale le div que tu viens d'afficher.
    et cache le.

var avant=document.getElementById('question1');
 function afficherPara(para)
 {
    avant.style.display="none";
  if(document.getElementById(para).style.display == 'none')
   {    avant=document.getElementById(para);
         avant.style.display = 'block';
    }
  else
   {    document.getElementById(para).style.display = 'none';   }
 }

    ça devrait le faire ( ou pas loin )

                Cordialement            Bul         [mon Site]     [M'écrire]

samedi 14 juin 2008 à 10:57:49 | Re : Besoin d'aide pour texte en accordéon

bultez

Membre Club
euh... d'ailleurs....

var avant=document.getElementById('question1');

 function afficherPara(para)
 {    avant.style.display="none";
       avant=document.getElementById(para);
       avant.style.display = 'block';
 }

    ça suffira....



                Cordialement            Bul         [mon Site]     [M'écrire]

samedi 14 juin 2008 à 15:21:49 | Re : Besoin d'aide pour texte en accordéon

devoluti0n

Bonjour, je sais pas vraiment pourquoi mais aucun des deux codes ne fonctionnent.


Bon cette ligne :

var avant=document.getElementById('question1');


je l'ai modifiée en

var avant=document.getElementById(para);

car je n'ai pas qu'une seule question.

Mais cela ne fonctionne pas, mais j'ai compris je pense le principe.
Il faut stocker dans une variable le dernier qui a été ouvert.
Je vais éssayer de trouver en utilisant cette méthode, merci :)

samedi 14 juin 2008 à 15:33:16 | Re : Besoin d'aide pour texte en accordéon

bultez

Membre Club
Réponse acceptée !
et pourtant... ça marche....
    si on met dans le "bon ordre" avec les id kivonbien...


<body>
<DIV onclick="afficherPara('question1');">La question 1</DIV>
<DIV id="question1" style="display:none">
   La réponse 1
</DIV>
<DIV onclick="afficherPara('question2');">La question 2</DIV>
<DIV id="question2" style="display:none">
   La réponse 2
</DIV>
<script>
var avant=document.getElementById('question1');

 function afficherPara(para)
 {    avant.style.display="none";
       avant=document.getElementById(para);
       avant.style.display = 'block';
 }
</script>
</body>



                Cordialement            Bul         [mon Site]     [M'écrire]

samedi 14 juin 2008 à 15:38:29 | Re : Besoin d'aide pour texte en accordéon

bultez

Membre Club
quand je dis dans le bon ordre, c'est
    var avant=document.getElementById('question1');
    après que cet élément soit décrit.

                Cordialement            Bul         [mon Site]     [M'écrire]

samedi 14 juin 2008 à 15:41:49 | Re : Besoin d'aide pour texte en accordéon

devoluti0n

Oui, et en effet, le script placé comme ceci ça fonctionne trés bien, et bisarment j'ai l'impréssion que ça fonctionne "trop" bien, je m'éxplique :

Je l'ai placé aprés la question 1, ce qui signifie que les autres questions sont en dessous, et malgrés le fait que la variable avant ne fait appel qu'a la premiere question, comment ce fait il que ça fonctionne avec les autres question portant un autre nom que "question1" ?

Malgré tout merci, mais j'attends quand meme une réponse :).
Merci encore !

samedi 14 juin 2008 à 15:53:31 | Re : Besoin d'aide pour texte en accordéon

bultez

Membre Club
Réponse acceptée !




ne pas oublier que le html/javascript c'est de l'interprété,
    ça s'exécute ligne par ligne ( en oubliant les functions )

<...id="toto"...
    document.getElementById("toto")...   c'est ok
    document.getElementById("titi")...      c'est ko
<..id="titi"...

var avant = question1 c'est uniquement pour la 1ère fois.
sinon, dans la fonction, il faudrait tester si un "précédent"
    existe, si avant est intialisé....   il vaut mieux, initialiser
    avant et faire un display="none" inutile la 1ère fois, que
    de tester si c'est la 1ère fois ou pas... à chaque fois !

la function affichepara peut-être située n'importe où....
    elle ne sera exécuté qu'une fois la page interprétee
    et aura accès à tous les ID.


                Cordialement            Bul         [mon Site]     [M'écrire]



Cette discussion est classé dans : aide, style, document, getelementbyid, para


Répondre à ce message

Sujets en rapport avec ce message

acces bouton [ par ben1 ] je suohaiterai vérifier que mes boutons sont bien actifs par .checked mais apparament ce ne fonctionne pas vraiment ... pourriez-vous m'aider?voici le javascript bouton checked function [ par ben1 ] je suohaiterai vérifier que mes boutons sont bien actifs par .checked mais apparament ce ne fonctionne pas vraiment ... pourriez-vous m'aider?> > voic Probléme entre deux scripts [ par massacr ] Bonjour, Je veux mettre deux scripts dans ma page.L'un est un effet de texte déroulant, l'autre est un effet d'ouverture de message au chargement de l document.getElementById('body').style.overflow='hidden' [ par Grand Mamamouchi ] Bonsoir !peux-tu m'expliquer pourquoi l'overflow n'est pas masque (jedeveloppe sur Mozilla 1.6) ?document.getElementById('body').style.overflow='hidde controle de mouvement d'un calque avec bouton [ par kartoon ] Bonjour,Je souhaiterai connaître l'astuce pour pouvoir controler le déplacement d'un calque :J'ai un bouton "deplacer" qui fonctionne en entrant une d <DIV> Explorer 5 Macintosh [ par jpastier ] Bonjour, J'ai réalisé un script qui me permet d'afficher les détails d'un lien. Tout fonctionne correctement sur les navigateurs Firefox, Safari, ma problème de div [ par algori ] Bonjour,Voilà, mon problème est qu'il se génère une erreur dans le script suivant quand j'essaie de fermer ma checkbox. Je suppose que l'erreur est si block/none de div [ par kishkaya ] voila j'ai des contenu et j'essaye de creer une fonction pour cacher ou afficher ces div en m'inspirant d'une fonction trouver sur ce site . Moi j'ai objet qui suit le souris [ par CCJ ] bonjour g trouver ce code ici : var x = 0; var y = 0; posX = 0; posY = 0; if (document.getElementById)    {    if(navigator.appName.substring(0,3). Marche pas sous IE [ par taxidogkiller ] Bonjour, j'ai télécharger un script de galerie d'image et en voulant le bidouiller je suis tomber sur des fonction javascript qui ne marche que sous m


Nos sponsors

Sondage...

CalendriCode

Juillet 2009
LMMJVSD
  12345
6789101112
13141516171819
20212223242526
2728293031  

Consulter la suite du CalendriCode

Téléchargements

Logiciels à télécharger sur le même thème :

Comparez les prix Nouvelle version

Photothèque Nouveau !



Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés
Temps d'éxécution de la page : 0,437 sec

Google Coop CodeS-SourceS Google Coop CodeS-SourceS


Certaines images présentes sur le site (notament certains avatars) sont issues des collections IconShock, donc si vous souhaitez utiliser ces icons vous devez les acheter, ne les copiez pas et ne utilisez pas dans vos sites et applications sans les avoir commandé.