Javascript - Cambio de imagen al pasar el mouse sobre enlaces

Códigos Javascript

Es un sencillo ejemplo " mouseover " o raton sobre, el cual muestra una imagen al lado de un enlace, pero al pasar el mouse sobre este enlace muestra otra imagen. Muy util para usar como menú

Tutores.org

Inicio > Javascript

Visitas: 32,371 - 25/03/2004 2:33:28

EXPLICACION

Debemos modificar las lineas donde aparece imgname.src

CODIGO

Este codigo aun no ha sido probado por Tutores.org en Opera

Este codigo aun no ha sido probado por Tutores.org en Safari

# Codigo ofrecido por Tutores.org

<HEAD>
<SCRIPT LANGUAGE="JavaScript">
function img_sobre(imgname){
imgname.src = "/tutores/images/flacha.gif"
}
function img_fuera(imgname){
imgname.src = "/tutores/images/dot.gif"
}
</SCRIPT>
<center>
<table border=0>
<tr><td>
<img name="pic1" SRC="blank.gif" width=10 height=10 border=0>
<A HREF="http://www.altavista.com" onMouseOver="img_sobre(pic1)" onMouseOut="img_fuera(pic1)">Altavista</A>
<br>
<img name="pic2" SRC="blank.gif" width=10 height=10 border=0>
<A HREF="http://www.yahoo.com" onMouseOver="img_sobre(pic2)" onMouseOut="img_fuera(pic2)">Yahoo</A>
<br>
<img name="pic3" SRC="blank.gif" width=10 height=10 border=0>
<A HREF="http://www.hotbot.com" onMouseOver="img_sobre(pic3)" onMouseOut="img_fuera(pic3)">Hotbot</A>
<br>
<img name="pic4" SRC="blank.gif" width=10 height=10 border=0>
<A HREF="http://www.google.com" onMouseOver="img_sobre(pic4)" onMouseOut="img_fuera(pic4)">Google</A>
<br>
<img name="pic5" SRC="blank.gif" width=10 height=10 border=0>
<A HREF="http://www.tutores.org" onMouseOver="img_sobre(pic5)" onMouseOut="img_fuera(pic5)">Tutores</A>
<br>
<img name="pic6" SRC="blank.gif" width=10 height=10 border=0>
<A HREF="http://www.forosdelweb.com" onMouseOver="img_sobre(pic6)" onMouseOut="img_fuera(pic6)">Forosdelweb</A>
<br>
</td></tr></table>
</center>

ENLACE AL CODIGO

Si quieres enlazar desde tu pagina a este codigo

<a title="Tutores.org - Cambio de imagen al pasar el mouse sobre enlaces" href="http://www.tutores.org/codigo/991/" target="_blank">Cambio de imagen al pasar el mouse sobre enlaces</a>

COMENTARIOS

Comentario usuario

blackman33blackman33

1 5

no comprendo muy claramente, no se donde debo sustituir la imagen

Comentario usuario

ChristopherChristopher

2 5

esta muy bien el codigo lo necesitaba, gracias

Comentario usuario

SaraSara

3 5

muy limpito el código, gracias

INSERTAR COMENTARIO

Usuario:
Email:
Comentario:
	Codigo Seguridad
	Antes de enviar un comentario... Todos los comentarios son revisados personalmente Todo comentario que no haga relacion al codigo mostrado en esta pagina sera eliminado Usuarios registrados tienen preferencia en recibir respuestas de ayuda!! Ademas de poder insertar Imagenes,Enlaces y otras propiedades del editor. Por favor, insertar los comentarios descriptivos.