16/10/2013

Efeito Blurry

||


Yo bunnie's! Como vão? Eu vou bem, apesar de estar com uma dor de cabeça bem chatinha. Hoje venho trazer um tutorial que achei em um blog desativado... as postagens e a escrita são ótimos, pena que parou... então venho trazer um tutorial feito por ela, se utilizarem por favor não esqueçam de creditar o blog Very Goodies.



1) Vá ate o HTML do blog e pesquise por ]]></b:skin>, acima dele cole:

.hoverblurry{
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
-o-border-radius: 50px;
-webkit-transition-duration: .90s;
-moz-transition-duration: .90s;
-o-transition-duration: .90s;
}
.hoverblurry:hover{
-webkit-transform: rotate(720deg);
-moz-transform: rotate(720deg);
-o-transform: rotate(720deg);
-webkit-filter: blur(1px);
-moz-filter: blur(1px);
-o-filter: blur(1px);
-webkit-transition-duration: .90s;
-moz-transition-duration: .90s;
-o-transition-duration: .90s;
}

Salve!

2) Agora vá em Layout e abra um gadget java script e dentro cole:

<a href="Link do Blog" title="Nome do Blog"><img src="Url da Imagem" class="hoverblurry"/></a>

Edite o que se pede e prontinho! Esse efeito nas imagens é a conselhável para Gadgets de afiliados em 50x50 ou menos, por ser um efeito meio carregado de visão.

Nenhum comentário:

Postar um comentário