miércoles, 1 de junio de 2011

Agrandar imágenes



Agrandar imágenes con solo pasar el ratón por encima de la imagen


Si queremos obtener este efecto, que nos puede servir bastante, porque no hace falta abrir la imagen en otra pestaña para verla bien, debemos poner el siguiente código cada vez que vayamos a poner una imagen(en Edición de HTML):


<img src="URL de la imagen" onmouseover="this.width=400;this.height=300;" onmouseout="this.width=100;this.height=80;" width="100" height="80" />

Dentro de este código, debemos editar lo siguiente:


- Cambiar URL de la imagen por la URL de la imagen en tamaño normal.
- Los width y height que están en rojo,son las medidas a las que se va a agrandar la imagen cuando pasemos el ratón por encima.
- Los width height que están en verde, son el ancho y el alto de la imagen en tamaño pequeño.


Width : Ancho
Height : Alto


Aquí os dejo el ejemplo:

No hay comentarios:

Publicar un comentario