SprintDevelop.com - Diseño y desarrollo web - Diseño, desarrollo web,Aplicaciones Móviles, TabletasSprintDevelop.com - Diseño y desarrollo web
Mostrando Codigo - Javascript
Code

Javascript - Efecto rollover

Códigos Javascript

Sencillo codigo para aplicar el efecto llamado rollover sobre imagenes
Visitas: 33,219 - 03/09/2003
DemoNO CONTIENE ARCHIVO DESCARGABLEComentario
EXPLICACION
Debemos modificar imagen1.gif por la imagen que deseemos, teniendo en cuenta que la imagen que reemplazara a esta al pasar el mouse por encima debe llamarse imagen2.gif Este es el funcionamiento del script, del valor de la imagen modifica el 1 por el 2
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. <html>
  2. <head>
  3. <script language="javascript">
  4. <!--
  5. function imageswap(imgx){
  6.  
  7.     var name=imgx.src;
  8.     var leng = eval(name.length) - 5;
  9.     var num=name.charAt(leng);
  10.  
  11.     if(num==1){
  12.     name = name.replace(1,2);
  13.     }
  14.     else{
  15.     name = name.replace(2,1);
  16.     }
  17.     imgx.src=name;
  18. };
  19. //-->
  20. </script>
  21. </head>
  22.  
  23. <body>
  24. <img src="/images/imagen1.gif" onMouseOut="imageswap(this);" onMouseOver="imageswap(this);">
  25. </img>
  26. </body>
  27. </html>



ENLACE AL CODIGO
Si quieres enlazar desde tu pagina a este codigo
<!-- Inicio enlace Tutores.org -->
<a title="Tutores.org - Efecto rollover" href="http://www.tutores.org/codigo/494/" target="_blank">Efecto rollover</a>
<!-- Final enlace Tutores.org -->
COMENTARIOS
Comentario usuario
01-12-2007 02:22:42
3 5
no entiendo esto, en la explicacion dice que hay que sustituir imagen1.gif por mi imagen, alli esta bien,despues dice sustituir imagen2.gif y no hay ni una parte del codigo que diga imagen2.gif, no se si se refiere al que dice imageswap(this), pero aun asi no me sale, alguien que me ayude
Comentario usuario
Mazabel
1 5
realmente no entiendo donde reemplazar la imagen2.gif
Comentario usuario
Mazabel
2 5
Bueno amigos, acabo de realizar el mismo codigo.. que esta expuesto y cree la carpeta tal cuali de imagenes con los nombres imagen1.gif, imagen2.gif funciona.
No hay que hacer ningún cambio, solo es hacerlo como esta .
Agradezco a la persona que hice este ejercicio inicialmente me saco de un apuro....
excelente.
Si me gustaria, saber como hacerlo para varias imagenes. Graci
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.