29 de nov. de 2012

Efeito Scale

Yo galera, venho trazer esse efeito muito show que achei na net. Qualquer dúvida deixe um comentário.

Demonstração

Procure por:

]]></b:skin>
Copie o código logo abaixo e cole acima dele:
/* Efeito Scale */
.imageside { margin-bottom:2px;margin-top:0px; }
.imageside img {background:#fff;width:225px; height:250px;align:center;}
.imageside .foto2 { -webkit-transform:scale(1.1); -moz-transform:scale(1.1); -o-transform:scale(1.7); opacity:0.9;-webkit-transition-duration: .59s;margin-top:-260px; opacity: 0;margin-left:-4px;-webkit-filter: grayscale(100%);-webkit-transition-duration: .99s;}
.imageside:hover .foto2 {-webkit-transform:scale(1.0); -moz-transform:scale(1.1); -o-transform:scale(1.0); opacity:1;}
/* Final Efeito Scale */

Código HTML:
<div class="imageside"><img src="URL DA IMAGEM"/><div class="foto2"><img src="URL DA IMAGEM"></div>

3 comentários: