#activar ~ .desplegable {display: none;overflow: hidden;} #activar:checked ~ .desplegable {display: block;} -->
Widget Nube De Etiquetas
95 Aniversario de GM FOOD
Añadir efectos a los vinculos de tus entradas
Iconos para nuestro blog
Script de casilla que se habre al selecionarlo
Slider deslizante para nuestras entradas
Scrollboxes cajas para nuestras entradas
Estilos de tipografías
iMAGEN LUPA
Slider para tus entradas
Indice entradas
Menu blogger

Agrandar imágen al pasar el cursor

Hoy vamos a explicaros como podemos hacer que una imágen se haga más grande al pasar el cursor por encima.
Para realizar esto lo que, es usar el editor HTMl, y pegamos este código.





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

    Cambiar la URL de la imagen (en su tamaño normal).
    El primer width y height es el tamaño que queremos que sea la imagen una vez agrandada, al pasar el cursor.

 Width es el ancho 
 Height es el alto.
    Los width y height que están en color verde son el ancho y alto de la imagen en tamaño pequeño.

Es la imagen que se ve en pequeña antes de pasar el cursor por encima.





Nota:
Antes de realizar cualquier cambio en nuestro blog, tendremos que realizar una copia de seguridad del mismo por si algo no sale bien.

Puedes ver en este post como lo hacemos paso a paso





   

Publicar un comentario

0 Comentarios