Divisor

Éste sitio web usa cookies, puedes ver la política de cookies, Aquí. ⤵ ⤵


Añadir efecto zoom con CSS3 en tus imágenes


Efecto Zoom CSS3


Siguiendo con el hilo del anterior artículo, vamos a escribir una entrada, para agregar imágenes en el cuerpo de los posts en Blogger. Trata de un efecto Zoom, sumamente conocido en el mundo del diseño web, y que no había publicado nada hasta ahora, está realizado con CSS3. Lo que debemos de hacer, es visualizar seguidamente la siguiente demostración del efecto a tratar, posteriormente, si te gusta el efecto zoom, en la imagen de muestra, pues sólo te queda que insertar lo en tu blog o en una web, así de sencillo.






Efecto zoom en texto



Añade en Blogger el CSS antes de ]]></b:skin>!

/* Zoom effect by http://www.aizumblog.com */
.zoom {
 transition: 1.5s ease;
-moz-transition: 1.5s ease; /* Firefox */
-webkit-transition: 1.5s ease; /* Chrome - Safari */
-o-transition: 1.5s ease; /* Opera */
}

.zoom:hover{
 transform : scale(2);
-moz-transform : scale(2); /* Firefox */
-webkit-transform : scale(2); /* Chrome - Safari */
-o-transform : scale(2); /* Opera */
-ms-transform : scale(2); /* IE9 */
}
/* Zoom effect by http://www.aizumblog.com */


Añade el HTML de imagen y texto dónde quieres que se vea el efecto


<img class="zoom" src="imagen.png" />

<div class="zoom">Efecto de zoom con CSS3</div>



Aizum Blog, sábado, marzo 15, 2014


Divisor Star

✏ Buscador!

En las redes ⤵

✏ Vídeos!

 

Publicidad!

Subir hacia arriba ▲ Modificated & Designed by Iván Dangerfield © 2014. Converted by Bloggertheme9