Efecto al pasar el cursor en imagen(dos tamaños)

Efecto al pasar el cursor en una imagen.

 

Este codigo es para una imagen lo que hace es que cuando tu le pasas el

cursor por encima cambia de tamaño ya sea de chico a grande o  grande a chico

los tamaños de la imagen seran a tu manera como los quieras poner .

a el codigo le colocas la URL de tu imagen y los tamaños en pixeles pero como vez estan de color

rojo y verdes, los verdes siempre deben ser similares , solo el rojo hara la accion cuando pases el cursor, te explico porque:

 

un codigo html de una imagen normal es esta:

 

<img src="AQUI PONES LA URL DE TU IMAGEN" width="500"    height="100" border="0" alt="" />

 

y estre ello se mete esto, lo que actuara para cambiar los tamaños usando el cursor:

 

onmouseover="this.width=650;this.height=120;"

onmouseout="this.width=500;this.height=100;"

 

onmouseover y onmouseout son las claves que actuaran sobre la imagen cada una seguido de la accion

width y height(ancho y alto):por eso se repite tres veces width y height

onmouseover:"el puntero del ratón sobre"   

onmouseout:"el ratón fuera" 

 

 

si quieres que la imagen se agrande los pixeles remarcados en rojo deben ser mayor a los remarcados en verde

y si quieres que se haga pequeña los pixeles en rojo deben ser menor que los verdes

 

 

 

 

CODIGO:(La imagen se hace grande)

<center>

<img src="AQUI PONES LA URL DE TU IMAGEN"

onmouseover="this.width=650;this.height=120;"

onmouseout="this.width=500;this.height=100;" width="500"    height="100" border="0" alt="" />

</center>

 

 

 

CODIGO:(la imagen se hace pequeña)

<center>

<img src="AQUI PONES LA URL DE TU IMAGEN"

onmouseover="this.width=450;this.height=80;"

onmouseout="this.width=500;this.height=100;" width="500"    height="100" border="0" alt="" />

</center>

 

Comentarios: 3
  • #3

    Litzia (martes, 28 mayo 2013 17:36)

    Podrias poner el codigo para este formulario que estoy llenando para recibir sugerencias

  • #2

    Carlos (sábado, 11 mayo 2013 14:48)

    excelente efecto
    =)

  • #1

    mariana (miércoles, 20 marzo 2013 18:14)

    esta muy suave