Hola.

Estoy intentando hacer que cada vez que se pasa el ratón por encima de un enlace se cargue una imagen diferente a la que tiene cuando no pasa el ratón por encima.
Pero la función quiero que se utilice para todos los enlaces, pero cada enlace tiene su respectiva imagen con su respectivo nombre, entonces he creado un par de funciones para que se cargue una imagen u otra según el nombre que le pases a la función.

Aquí está el código de la javascript:

boton_on = new Image();
boton_off = new Image();
function entra_boton(boton){
	boton_on.src = "imatges/botons/" + boton + ".png";
	boton_off.src = "imatges/botons/" + boton + "b.png";
	document.images[boton].src = boton_on.src;
}
function sale_boton(boton){
	document.images[boton].src = boton_off.src;
}
 

y aquí el código del enlace/imagen que tiene que cambiar su aspecto cuando pasa el ratón por encima:

<a href = "estudios.php" onmouseover = "entra_boton(boton1)" onmouseout = "sale_boton(boton1)">
      <img src = "imatges/botons/boton1.png" name = "boton1" border="0">
</a>
 

Bien, pues no me funciona, a ver si alguien puede decirme que pasa.

Gracias de antemano.

Porqué no lo haces con CSS?