Aumentar imágenes al pasar el cursor con efecto deslizante

arbey tutoriales

 

Les tengo un método para poder agrandar imágenes a partir un script llamado Expando que permite expandir imágenes desde un tamaño a otro con efecto deslizante y que al quitar el cursor vuelve a la forma pequeña

.

Tu defines el tamaño pequeño, cuando el cursor pase sobre la imagen este volverá a su tamaño original.

 

Solo bastara poner los siguientes códigos para lograr este afecto a ciertas imágenes que tú quieras expandir.

 

Son tres códigos lo que necesitaremos, 2 códigos van colocados en el head que son el script y el css y el otro código va en un widget Html con la url de la imagen correspondiente.

 

Código En El Head

 

<script type="text/javascript" src="http://archivoswebdesignworld.site50.net/

Efecto%20expandir%20imagenes/Expando%20Image.js">

</script>

 

<style type="text/css">

/*<![CDATA[*/

img.expando{

margin:10px;

vertical-align: top;

}

/*]]>*/

</style>

 

 

 

 

 

 

Código Html

<img border="0" src="URL de la imagen" class="expando" width="100" alt="" />

Listo, solo queda colocar la URL de la imagen a la cual le quieres colocar el efecto.

 

 

 

estos codigos se los debemos a nuestro amigo webdesignworld el que se merece todos los cretidos   http://webdesignworld.jimdo.com/

Escribir comentario

Comentarios: 0
foto tutorial
CLIC EN LA IMAGEN