30 novembro 2012

Spin Effect

Oi galera, estou aqui novamente só que agora com um tuto, esse efeito é muito legal e da para ser utilizado para elite de afiliados e tal, criatividade é com vocês preview, esse efeito não foi eu que criei eu peguei este tutorial no tumblr WorldDesigns então créditos para ele e para mim ok? Vamos ao tuto.
Primeiramente você irá abrir o o editor de html do seu blog, e procurar o seguinte código:
]]></b:skin>
Logo após encontra isso, cole o seguinte código acima do código anterior.
#spineffect
    {-moz-transition: all 0.5s ease-out;
    -webkit-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;
    -ms-transition: all 0.5s ease-out;
    transition: all 0.5s ease-out;}
   
#spineffect:hover
    {-webkit-animation-name: spin;
    -webkit-animation-duration: 400ms;
    -webkit-animation-iteration-count: 2;
    -webkit-animation-direction: alternate;}
@-webkit-keyframes spin  
    {from {opacity: .99;
    -webkit-transform:rotate(0deg);
    -o-transform:rotate(0deg);
    -moz-transform: rotate(0deg);}
    to {opacity: .30;
    -webkit-transform:rotate(360deg);
    -o-transform:rotate(360deg);
Não irei explicar o código por que não entendi direito mas é só vocês irem cutucando aqui e ali e pronto seu efeito estará quase pronto, falta algo ainda.
Por ultimo cole o código abaixo em um gadget de html/javascript.
<a href="Link_Aqui"><img src="link_da_tua_imagem" id="spineffect"></a> 
Onde está Link_Aqui você irá colocar algum link exemplo:
 <a href="http://its--blog.blogspot.com"><img src="link_da_tua_imagem" id="spineffect"></a> 
e onde está link_da_tua_imagem vocês vão colocar o link de alguma imagem. Se não quiserem colocar nenhum link basta tirar essa parte do código.
<a href="Link_Aqui">

2 comentários:

  1. Adorei o efeito, eu estava mesmo procurando um efeitinho diferente, esse tuto foi muito útil (:

    Ahh querido, muito obrigada pelo apoio XoXo'

    your smile ♥

    ResponderExcluir

Obrigado por comentar, estará me ajudando muito, a continuar a desenvolver o blog para vocês, caros leitores.
Aviso: Nunca comente sem antes ter lido a postagen, e pff não façam comentarios ofensivos ou com links (pois o google está a excluir blogs) pois esses links são identificados como spam pelo google espero que coompreendam.
Deixou um louco blogueiro feliz \o/\o/\o/