Javascript para el Truco que Cambia una imagen por otra al Pasar el mouse por encima, Classic Blogger

Classic Blogger, Imagenes, Plataformas, Trucos Script/Plugin/Widget

Este primer código va entre las etiquetas <head> y </head> (el comienzo de esta etiqueta esta en las primeras lineas de toda su plantilla), este codigo se copia textual, y no se le hace ningún cambio, solo en el segundo se cambian las url de las imagenes:

< View plain text >
js

  1. <!-- Consigue mas JavaScript en http://www.mundojavascript.com -->
  2. <!-- Swap images
  3. function Permut (flag,img) {
  4.    if (document.images) {
  5.         if (document.images[img].permloaded) {
  6.             if (flag==1) document.images[img].src = document.images[img].perm.src
  7.             else document.images[img].src = document.images[img].perm.oldsrc
  8.         }
  9.    }
  10. }
  11. function preloadPermut (img,adresse) {
  12.    if (document.images) {
  13.         img.onload = null;
  14.         img.perm = new Image ();
  15.         img.perm.oldsrc = img.src;
  16.         img.perm.src = adresse;
  17.         img.permloaded = true;
  18.    }
  19. }
  20. // -->

y este segundo codigo es en donde se verá el efecto, debe ir debajo de <body>:

< View plain text >
HTML

  1. <a href="http://tekytips.com/personal">
  2. <img src="http://photos1.blogger.com/blogger/5923/1205/200/toplaya.jpg" border="0">
  3. </a>

Lo que se obtiene como resultado, lo pueden ver pasando el mouse sobre mi foto en la columna izquierda, en este caso yo puse la direccion de mi blog personal, obviamente ustedes la cambian por lo que quieran.
Este es el link de mi primera imagen:
http://photos1.blogger.com/blogger/5923/1205/200/toplaya.jpg
Y este es el link de la segunda:
http://photos1.blogger.com/blogger/5923/1205/200/DSCN4479.jpg
Lo unico que deben hacer es sustituir estos links por los de ustedes en el segundo codigo.

Actualización del Post: 8/12/2007

Si quieres dejar este accesorio en la sidebar (barra lateral) y tienes dudas, revisa esta entrada: Donde Debo Pegar el Código de Algún Accesorio en mi Plantilla (Template).
Y si necesitas un host gratuito para subir tus imágenes revisa los siguientes post:
–Hosting Gratuito
–Paginas para Subir Archivos

Artículos Relacionados

  • Direcciones cortas para tu blog Primero debo agradecer a Patricia por la invitacion, y felicitar al grupo por esta iniciativa... de hacer un poco mas facil la vida a quienes no sabemos HTML... Este dato les puede […]
  • Como agregar una Imagen en el Titulo, Parte II, TICTAC, Classic Blogger Para agregar una imagen al título en el Template TICTAC...El procedimiento ES SIMILAR AL DEL Son of Moto, La única diferencia es que la imagen tiene distinto largo, el ancho se ajusta […]
  • Por que se baja la columna lateral o sidebar ? Esta explicación es útil para cualquier plataforma de blogs, wordpress, blogger, ..ya que el error es el mismo. Esto es besico muchos ya lo saben, pero como cada vez llega más gente con […]
  • Pantones Esta entrada es independiente del tipo de Plataforma de Blogs que utilizas. A la hora de de armonizar nuestro blog con los colores que traen, la mayoría de los codes HTML, generalmente, […]
  • Post Por Hacer 1.-Area para dejar comentarios debajo del post. 2.-Cambiar de lado la sidebar o barra lateral. 3.-Imagen del titulo cambiante. 4.-Imagenes de fondo (otro metodo). 5.-Explicar .css de las […]
  • Accesorios para el Blog, Adornos, Cursores, Relojes Navegando por la red, me he encontrado con el website de Lady Lony y entrega varios codes para "amononar" nuestros […]
patriram
Soy Blogger desde hace mucho tiempo. Inicialmente este blog se creó para entregar tutoriales paso a paso a las personas que estuvieran ingresando al mundo online. Muchos de mis tutoriales no requieren de conocimiento previo ni habilidades, la idea siempre fue tender una mano a los que usualmente no entienden nada. Como pueden ver estuvo bastante abandonado por varios años pero ahora lo retomaré con otro énfasis, explicación de herramientas mas complejas, y en la medida de lo posible se irán renovando los post que con el tiempo han quedado obsoletos.

About patriram

Soy Blogger desde hace mucho tiempo. Inicialmente este blog se creó para entregar tutoriales paso a paso a las personas que estuvieran ingresando al mundo online. Muchos de mis tutoriales no requieren de conocimiento previo ni habilidades, la idea siempre fue tender una mano a los que usualmente no entienden nada. Como pueden ver estuvo bastante abandonado por varios años pero ahora lo retomaré con otro énfasis, explicación de herramientas mas complejas, y en la medida de lo posible se irán renovando los post que con el tiempo han quedado obsoletos.

Leave a Reply

Your email address will not be published. Required fields are marked *