Merci pour l'explication, je vais le tester.

<div id ="GDBox">...</div>

oui alors, ta page HTML est composés d'éléments, que javascript peut reconnaitre grâce à son id qui doit être unique.

Un <div></div>, un <span></span> un <input>, toute balise peut être considérée comme un élément.

Pour que javascript puisse reconnaitre les éléments, on définit des id pour les balises qui nous intéressent.

ainsi
[html]<div id ="GDBox">...</div>[/html]

Si on veut récupérer toutes les informations sur le div de dessus grâce à javascript, on va appeler, dans une fonction JS, l'élémént GDBox grâce à une méthode :

[code]var element = document.getElementById("GDBox");[/code]

Maintenant, cet élément à certaines propriétés intéressantes.En particulier son contenu HTML
Ainsi tout ce qui concerne la valeur du contenu HTML de l'élément se met à jour et se retrouve grâce à a propriété inner.html

[code]var element = document.getElementById("GDBox");
var contenu =element.innerHTML;

[/code]

La fonction, que fait elle?
Elle va construire une chaine de caractère au format HTML, c'est ce qu'on veut avoir au final à l'interieur du div GDBox

[code]var contenu='';

contenu+=''
+'<div id="P1Box">\n'
+' <img src="image1bis.gif">\n'
+'</div>\n'

+'<div id="P2Box" onClick="modifie_contenu_GDBox();">\n'
+' <img src="...">\n'
+'</div>\n';

[/code]

C'est le même code que celui de la page html initial mais avec le nom de l'image qui change afin qu'une autre image s'affiche.
Maintenant qu'on a construit le futur contenu, on appelle l'élément :
[code]var e = document.getElementById("GDBox");[/code]
et on lui affecte son nouveau contenu HTML :
[code]e.innerHTML = contenu;[/code]

Voilà, ce qui est important c'est de savoir qu'une fois qu'on a préciser un id à un élément, celui ci doit être unique et on peut le retrouver grâce àà document.getElementById(...);
Ensuite une fois qu'on a retrouvé un élémént, il faut savoir que tout son contenu HTML est symbolisé par la propriété element.innerHTML.
on peut alors affecter les valeurs qu'on veut pour le contenu HTML de l'élément en manipulant cette propriété grâce à des chaines de caractères.

Commence par faire des tests assez simples (des div ne contenant qu'une image par exemple) puis une fois que tu as vu un peu comment ça marche, tu compléxifie le contenu des div

Un peu complique, est ce possible de l'expliquer stp

Un peu grossièrement, il faut faire quelquechose dans ce genre là :


[code]<script>
function modifie_contenu_GDBox(){

var e = document.getElementById('GDBox');

var contenu='';

contenu+=''
+'<div id="P1Box">\n'
+' <img src="image1bis.gif">\n'
+'</div>\n'

+'<div id="P2Box" onClick="modifie_contenu_GDBox();">\n'
+' <img src="...">\n'
+'</div>\n';


// on peut aussi tenter
//depart = e.innerHTML;
//contenu = depart.replace("image1.gif","image1bis.gif");

e.innerHTML = contenu;


}

</script>




<div id="GDBox">

<div id="P1Box">
<img src="image1.gif">
</div>

<div id="P2Box" onClick="modifie_contenu_GDBox();">
<img src="...">
</div>

</div>[/code]

Bonjour,

Je voudrais que lorsqu'un utilisateur clique sur une span qui est sous forme de boutton, la grande span (qui contient 2 differentes span) se rafraichisse et affiche des bouttons desactives.

Voila un schema explicatif sur l'evenement.

[img]http://img822.imageshack.us/img822/1403/spans.png[/img]

Merci