Estou aqui de novo com um tutorial desenvolvido e feito totalmente por mim! Eu achei o efeito muito lindo, e fiz com todo o carinho para vocês...
Ai vai o tutorial espero que gostem!!
Vá até Modelo => Editar HTML, e aperte Ctrl + F e procure por:
]]></b:skin>
E acima desse código cole esse:
/* Efeito by Mariana Ramos, não retire os créditos */
.Rollshine {
transform: rotate(0deg) ;
-webkit-transform: rotate(0deg) ;
-moz-transform: rotate(0deg) ;
-o-transform: rotate(0deg) ;
-ms-transform: rotate(0deg) ;
-webkit-transition-duration: .80s;
-moz-border-radius: 03px;
-webkit-border-radius: 15px 15px 15px 15px; */ Bordas arredondadas, apague se não quiser */
border: 2px solid #AB82FF; /*cor e tamanho da borda*/
-webkit-transition-duration: .80s; */ Efeito fade */
-webkit-filter: saturate(110%) ;
}
.Rollshine:hover{
transform: rotate(360deg) ;
-webkit-transform: rotate(360deg) ;
-moz-transform: rotate(360deg) ;
-o-transform: rotate(360deg) ;
-ms-transform: rotate(360deg) ;
border: 1px solid #B5B5B5; /*cor e tamanho da borda*/
-webkit-border-radius: 30px 30px 30px 30px; */ Bordas arredondadas, apague se não quiser */
-moz-box-shadow: -2px 1px 31px #000000;-webkit-box-shadow: -2px 1px 31px #000000;box-shadow: -2px 1px 31px #000000;-webkit-filter: saturate(0%); */efeito preto e branco, apague se não quiser */
-webkit-transition-duration: .60s; */ Efeito fade */
}
Acho que já está tudo em explicadinho, e tudo que estiver destacado, pode ser modificado por vocês, deixando o efeito do jeito de vocês.
Para aplicar o efeito aos afiliados, adicione um gadget HTML/JavaScript, e colando isso:
<a href="LINK DO BLOG"title="NOME DO BLOG"><img src="URL DA IMAGEM" class="Rollshine"/></a>
E também vou disponibilizar algumas imagens que fiz, não usei um tema específico, mas ficaram bem fofas, as que usei são imagens de flores, cabelos, docinhos e estão todas no tamanho de 60 x 60, emfim espero que gostem:
Nenhum comentário:
Postar um comentário