Efeito Reduction

O nome deste efeito é justamente Reduction porque ele reduz quando passamos o mouse em cima, vejam:
Para fazer esse efeito, copie o código abaixo e coloque em seu css (entre <style> e </style>)
.sweetpoison3 {border: 2px solid #000; 
width: 60px; height:90px; 
opacity: .5; margin: 2px; 
-webkit-transition-duration: .80s;-moz-transition-duration: .80s;}
.sweetpoison3:hover {opacity: 1; 
-webkit-transition-duration: .80s;-moz-transition-duration: .80s;
transform: rotate(0deg) scale(0.768) skew(1deg) translate(18px);
-webkit-transform: rotate(0deg) scale(0.768) skew(1deg) translate(18px);
-moz-transform: rotate(0deg) scale(0.768) skew(1deg) translate(18px);
-o-transform: rotate(0deg) scale(0.768) skew(1deg) translate(18px);
-ms-transform: rotate(0deg) scale(0.768) skew(1deg) translate(18px);
}
E coloque o código abaixo onde você quer que apareça o efeito:

<a href="LINK DO SITE" target="_blank"><img src="http://i.imgur.com/OzZoVPn.png" class="sweetpoison3"/></a>
Por: Pâmela Sampaio em 04/05/14
Não copiem o tutorial e nem os códigos.
Deem os devidos créditos se o tuto for útil de alguma forma.
Facebook Twitter Pinterest Google+ Email Addthis