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, rápido, y escueto, enjoy this zoom effect!
Añade en Blogger el CSS antes de ]]></b:skin>!
/* Zoom effect by http://www.aizumblog.com */
.aumento img{
-webkit-transform:scale(0.8);
-moz-transform:scale(0.8);
-o-transform:scale(0.8);
-webkit-transition-duration: 0.5s;
-moz-transition-duration: 0.5s;
-o-transition-duration: 0.5s;
opacity: 0.7;
margin: 0 10px 5px 0;
}
.aumento img:hover{
-webkit-transform:scale(1.1);
-moz-transform:scale(1.1);
-o-transform:scale(1.1);
opacity: 1;
}
/* Zoom effect by http://www.aizumblog.com */
Añade el HTML de imagen dónde quieres que se vea el efecto
<a class="aumento" href="Aquí_enlace_imagen" target="_blank"> <img src="Aquí_la_imagen" /></a>
Get free premium widgets for your blog and website.
Puzzle Bobble
Karate Blazers
Puzzle De Bloques
Magical Cat Adventure