Efeito para afiliados : Efeito Circulation

| |
ú.ú Olá gente , antes o sem vergonha aqui queria pedir desculpas por não postar semana passada pois eu estava viajando :) ,Bom no grupo da Kaorii ela postou um post de comida todos começaram a falar de comida, agora a culpa é sua Clara, agora eu estou com fome e aqui em casa não tem comida e.e ~chora .Como foi a semana de vocês ? a minha foi demais foi uma das melhores semanas da minha vida. pdc que foi sim -melhor do que o carnaval :v

Bom hoje eu vim trazer um efeito para afiliados que eu fiz há muito tempo mas resolvi postar agora o nome do efeito é Circulation ele é um bom efeito para ser usando em afiliados eu gostei muito dele apesar de ser meu primeiro efeito não vou me gabar por isso você pode encontrar o preview aqui



Vá no seu Html e Tecle Crtl+F e procure por ]]></b:skin>
Antes do codigo que você achou e cole um desses codigos



Efeito 1


.circulation{
outline: solid 1px #fff;
outline-offset: -5px;
-webkit-transition: 0s linear;
-webkit-transition: opacity 0.5s linear;
-webkit-transition: all 0.3s linear;
-webkit-transition: all 0.3s linear;
-moz-transition: all 0.3s linear;
transition: all 0.3s linear;
-webkit-transition-duration: 2.1s;
-webkit-filter: none; -webkit-transition:all 1s ease;padding: 3px;
cursor: help;
}
.circulation:hover{
-webkit-transform: scale(1.20);
-moz-transform: scale(1.20);
-webkit-transform: rotate(-1080deg);
-moz-border-radius: 90px;
-webkit-border-radius: 80px;
padding: 3px;
-webkit-filter:sepia(1);
cursor: help;
outline: solid 60px transparent;
opacity: 0.4;
outline-offset: -110px;
-webkit-transition-duration: 3.0s;
}


Efeito 2

.circulationdois{
outline: solid 1px #fff;
outline-offset: -5px;
-webkit-transition: 0s linear;
-webkit-transition: opacity 0.5s linear;
-webkit-transition: all 0.3s linear;
-webkit-transition: all 0.3s linear;
-moz-transition: all 0.3s linear;
transition: all 0.3s linear;
-webkit-transition-duration: 1.4s;
-webkit-filter: none;
-webkit-transition:all 1s ease;padding: 3px;
cursor: help;
}
.circulationdois:hover{
-webkit-transform: scale(1.20);
-moz-transform: scale(1.20);
-webkit-transform: rotate(-1080e);
-moz-border-radius: 50px;
-webkit-border-radius: 50px;
padding: 3px;
-webkit-filter:grayscale(1);
cursor: help;
outline: solid 60px transparent;
opacity: 0.4;
outline-offset: -110px;
-webkit-transition-duration: 1.4s;
}


Agora que você ja colocou o código, para aplicar o efeito você vai colocar o código seguinte no gadget ou em outro canto
Efeito 1
<img src="URL DA SUA IMAGEM" class="circulation">
Efeito 2
<img src="URL DA SUA IMAGEM" class="circulationdois">

Bom gente é um tutorial bem simples como vocês podem ver se usarem por favor creditem e se gostarem ou sarem comentem aqui em baixo :D



10 comentários:

  1. Que legal o 2! Vou usar no meu próximo layout. *u*

    Little Heart

    ResponderExcluir
  2. Oi, aqui é minha primeira visita no blog, haha XD ~ acho que sei quem és tú... Pedro Caio? Aqui no blog só tem o primeiro nome, mas acho que você é Pedro Caio -q Não sei se lembra de mim, as sou a Jayanne, que ficou horas lá comentando :p (pratinho de 2 reais) *-* Enfim os efeitos são lindos ♥ principalmente o primeiro!

    www.c-desonhos.com | ♥

    ResponderExcluir
    Respostas
    1. kkk me lembro sim pratinho de 2 reais é vida rsrs

      Excluir
  3. Adorei os efeitos, não gosto muito de usar. Mas estão lindos >3<
    Beijos, r-eaders

    ResponderExcluir
  4. Amei o efeito é muito lindinho, se possível vou usar no próximo layout <3
    Beijos | Findlle

    ResponderExcluir
  5. Que efeito fofo e divertido xD

    Beijos ~
    garotas-cupcakes

    ResponderExcluir

# - Não fique com essa besteira de Primeiro a comentar
# - Se tiver alguma dúvida na postagem fale explicadamente ou avise pela Ask
# - Se quiser fazer um pedido de postagem peça pela Ask
# - Não faremos explicações grandes se der fazemos o tutorial - Não estamos prometendo
# - Agora pode Comentar :)