botones con cambio de imagen

[meloni]

Hola a todos:
Me estoy volviendo mono con algo que seguramente es una tonteria. Tengo una página en Flash con unas secciones que tienen una botonera en la cual aparece una imagen diferente según el boton que pulses. Resulta que la página es muy pesada y la quiero hacer en HTML, con javascripts o similar, pero no encuentro la forma. ¿Me puede ayudar alguien?. Gracias de antemano.
Perdón, la página es architecnica.net

[danico90]

Eso de los botones que cambien de imagen se hace con css, solo le pones de fondo la imagen y cuando esta el puntero sobre el boton entonces que cambie. Para esos efectos de "fade" y todo eso podrias usar jquery que es un framework de javascript que trae varios efectos parecidos a esos.

[meloni]

Perdona, pero no me he explicado bien. La imagen que quiero cambiar no está dentro del botón sino en otra <div>. Osea, tendría que ser un botón con una imagen de sustitución que, al hacer click, cambiase la imagen que hay dentro del botón y además la de la otra <div>.

[meloni]

He conseguido lo del siguiente post

[meloni]

Bueno, he colocado lo siguiente en la div donde están las fotos:

<div id="foton" style="left:200px; top:100px;position:absolute; width:580px; height:380px; z-index:1; ">
<img class="fotos id="foto1" src="images/jpge/matias1.jpg" style="visibility: hidden" alt="" />
<img class="fotos id="foto2" src="images/jpge/dinosx3.jpg" style="visibility: hidden" alt="" />
<img class="fotos id="foto3" src="images/jpge/puertox4.jpg" style="visibility: hidden" alt="" /></div>

//El tamaño, posición y z_index de las fotos estan definidos en CSS//

#foto1{
position:absolute; width:580px; height:380px; z-index:2;}
#foto2{
position:absolute; width:580px; height:380px;z-index:3;}
#foto3{
position:absolute; width:580px; height:380px;z-index:4;}

Luego está el boton y su código:

<div id="boton1" style="position:absolute; left:0px; top:50px;"><a href="#" onmouseout="MM_swapImgRestore()"

onmouseover="MM_swapImage('botonG','','images/vw2.png',1)"><img src="images/vw1.png" name="botonG" width="98" height="18" border="0"

id="botonG" onClick="document.getElementsByClassName('foto s'). style.visibility="hidden" document.getElementById('foto1').style.visibility= "visible"";/></a></div>"

Este codigo no hace nada. ¿Me puede ayudar alguien?
Lo que quiero es que al pulsar la instancia "botonG" se muestra la foto 1 y las otras dos, no.
Gracias a todos otra vez.