Publicentral.com - promocion,paginas,web,tutores,publicentralPromocion de paginas webs
Mostrando Codigo - Javascript
Code

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ú
Visitas: 31,398 - 25/03/2004 2:33:28
DemoNO CONTIENE ARCHIVO DESCARGABLEComentario
EXPLICACION
Debemos modificar las lineas donde aparece imgname.src
CODIGO
Este codigo aun no ha sido probado por Tutores.org en ChromeEste codigo aun no ha sido probado por Tutores.org en FirefoxCodigo probado en Internet Explorer 7+Este codigo aun no ha sido probado por Tutores.org en OperaEste codigo aun no ha sido probado por Tutores.org en Safari


# Codigo ofrecido por Tutores.org

  1. <HEAD>
  2. <SCRIPT LANGUAGE="JavaScript">
  3. function img_sobre(imgname){
  4. imgname.src = "/tutores/images/flacha.gif"
  5. }
  6. function img_fuera(imgname){
  7. imgname.src = "/tutores/images/dot.gif"
  8. }
  9. </SCRIPT>
  10. <center>
  11. <table border=0>
  12. <tr><td>
  13. <img name="pic1" SRC="blank.gif" width=10 height=10 border=0>  
  14. <A HREF="http://www.altavista.com" onMouseOver="img_sobre(pic1)" onMouseOut="img_fuera(pic1)">Altavista</A>
  15. <br>
  16. <img name="pic2" SRC="blank.gif" width=10 height=10 border=0>  
  17. <A HREF="http://www.yahoo.com" onMouseOver="img_sobre(pic2)" onMouseOut="img_fuera(pic2)">Yahoo</A>
  18. <br>
  19. <img name="pic3" SRC="blank.gif" width=10 height=10 border=0>  
  20. <A HREF="http://www.hotbot.com" onMouseOver="img_sobre(pic3)" onMouseOut="img_fuera(pic3)">Hotbot</A>
  21. <br>
  22. <img name="pic4" SRC="blank.gif" width=10 height=10 border=0>  
  23. <A HREF="http://www.google.com" onMouseOver="img_sobre(pic4)" onMouseOut="img_fuera(pic4)">Google</A>
  24. <br>
  25. <img name="pic5" SRC="blank.gif" width=10 height=10 border=0>  
  26. <A HREF="http://www.tutores.org" onMouseOver="img_sobre(pic5)" onMouseOut="img_fuera(pic5)">Tutores</A>
  27. <br>
  28. <img name="pic6" SRC="blank.gif" width=10 height=10 border=0>  
  29. <A HREF="http://www.forosdelweb.com" onMouseOver="img_sobre(pic6)" onMouseOut="img_fuera(pic6)">Forosdelweb</A>
  30. <br>
  31. </td></tr></table>
  32. </center>



ENLACE AL CODIGO
Si quieres enlazar desde tu pagina a este codigo
<!-- Inicio enlace Tutores.org -->
<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>
<!-- Final enlace Tutores.org -->
COMENTARIOS
Comentario usuario
blackman33
5 5
no comprendo muy claramente, no se donde debo sustituir la imagen
Comentario usuario
Christopher
2 5
esta muy bien el codigo lo necesitaba, gracias
Comentario usuario
Sara
4 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.