11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour à tous!

Débutant en javascript j aurai bien besoin de votre aide pour réaliser quelque chose de pas facile..

Mon souhait :
J'ai 2 blocs DIV , dans un des blocs j affiche des photos, dans l autre je vais afficher du texte en rapport avec chaque photo

Le but est alors que en cliquant sur une photo, on ait un texte qui apparait, ensuite si on clique sur une seconde photo, le texte disparait et est remplacé par un texte différent ! et ainsi de suite..

Pourriez-vous me guider pour arriver à cet objectif ...de la façon la plus simple! Smiley ravi

Merci d avance à tous!!
Voici ce que je réussis à faire comme un "grand" lol

Mon bloc qui contient les photos
<img src="3.jpg" alt="xxx" onmouseover="javascript:this.src='4.jpg';document.getElementById('texte1').style.display='block';" onmouseout="javascript:this.src='3.jpg';document.getElementById('texte1').style.display='none';" />

Mon bloc qui contient le texte
</a>
<div id="texte1" style="display:none;">blablabla</div>


Donc voila, l'effet se produit je passe la souris sur la photo, le texte apparait, je retire la souris le texte disparait, ..MAIS voila maintenant moi j aimerai faire le même genre d effets sauf que pour faire apparaitre le texte il faut CLIQUER sur la photo et le texte disparait si on clique sur l autre photo..

Qqun a t il une idée de la façon dont je peux adapter mon code pour arriver à ce résultat ??

Merci d'avance!