Discussion :

[cyraile]

Bonjour,

Je ne sais pas si je poste dans le bon forum, mais je tente ici car il me semble que c'est le plus problable. Merci de me rediriger si je fais fausse route.


J'essaye de trouver comment faire un genre de box avec un bouton de déroulement pour permettre l'ouverture d'un corp de message.
Je ne sais pas si je m'exprime bien alors je joint 2 images :

plus et minus.

En fait la première étape consiste à afficher l'image 'plus' et quand on clique sur le plus, la boite s'allonge est fait appraître le corp du message. Ensuite on peut revenir à l'état initiale en cliquant sur le moins.

J'espère avoir été assez clair.

Merci d'avance.

[bigboomshakala]

bonjour,

2 <DIV> ou une <TABLE> avec 2 lignes

sur le clic sur l'image +
- tu testes l'image affichées, et tu la remplaces par la 2è (comme c'est +, on met -)
- tu fais apparaitre la 2è div (ou 2è ligne de la table) : style.display = 'block'

maintenant on a la partie basse affichée ainsi que l'image -

sur le clic sur l'image -
- tu testes l'image affichées, et tu la remplaces par la 2è (comme c'est -, on met +)
- tu fais disparaitre la 2è div (ou 2è ligne de la table) : style.display = 'none'

[le_chomeur]

Salut

alors en gros :

coté js

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
 
//si etat = true alors la fenètre est ouverte ...
var etat = true ;
function openClose(){
if(etat){
document.getElementById('contenu').style.display = "none";
document.getElementById('image').src = "tonurlimgplus";
etat = false;
}
else{
document.getElementById('contenu').style.display = "block";
document.getElementById('image').src = "tonurlimgmoins";
etat = true;
}
}

coté html :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
<div>
<p><img src="" id="image" onclick="openClose()" /> .... ton titre</p>
<div>tout le contenu etc ...</div>
</div>

de tète donc désolé si il y a quelques erreurs, bon courage

[cyraile]

Merci beaucoup bigboomshakala et le_chomeur.

Petite correction

Coté HTML :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
<div>
<p><img src="" id="image" onclick="openClose()" /> .... ton titre</p>
<div id="contenu">tout le contenu etc ...</div>
</div>

Tu avais oublié id="contenu".

Donc voila ce bout de code marche très bien.

Je l'ai même modifié pour l'inclure dans une table afin d'avoir différentes lignes ayant cette propriété.

Merci encore.