Voltei + Efeito Parce e Efeito Agitated


Hey Rilakkumas, VOLTEI.
  Olá pessoal, sentiram minha falta? Eu senti saudades de vocês, passei mais de um mês longe daqui, perdi tanta coisa mas estou gostando tanto do rumo do blog. Primeiramente queria agradecer a participação de vocês que está aumentando bastante, obrigado especial a Lovy que continuou com o blog e adicionou mais duas pessoas a familia C&C, o meu amigo Mochizou e a Gabi. Vi as postagens de vocês e gostei bastante, já me considero amigo.
  Poderia passar o resto da tarde agradecendo e mandando recados, mas preciso postar. Hoje eu trago dois efeitos que há tempos deveria ter postado. O Efeito Parce e o Efeito Agitated, os dois são efeitos conhecidos mas pode ser novidade para alguns de vocês, eu gosto de ambos e é só isso mesmo, rsrsrsrs.
Preview Efeito Parce aqui || Preview Efeito Agitated aqui


|| Efeito Parce ||

Vá em MODELO >> EDITAR HTML e procure por ]]></b:skin>
Acima dele cole esse código e depois salve.
.parce{max-width:auto; margin:1px;border-radius:4px;-webkit-transition: all 0.4s linear;-moz-transition: all 0.4s linear;transition: all 0.4s linear;}
.parce:hover{-webkit-animation: roda 2s infinite alternate;
-moz-animation: roda 2s infinite alternate;
-ms-animation: roda 2s infinite alternate;
-o-animation: roda 2s infinite alternate;
animation: roda 2s infinite alternate;}
E para que o efeito apareça use esse código. Repita quantas vezes precisar e troque o que precise.
<a href="URL_BLOG" target="_blank" title="NOME_DO_BLOG"><img class="parce" src="LINK_DA_IMAGEM" /></a>
|| Efeito Agitated ||

Vá em MODELO >> EDITAR HTML e procure por ]]></b:skin>
Acima dele cole esse código e depois salve.
@-webkit-keyframes gangorra {
from {-webkit-transform: rotate(10deg);}to {-webkit-transform: rotate(-10deg);} }
@-moz-keyframes gangorra {
from {-moz-transform: rotate(10deg);}to {-moz-transform: rotate(-10deg);} }
@-o-keyframes gangorra {
from {-o-transform: rotate(10deg);} to {-o-transform: rotate(-10deg);} }
.mn {
text-align: center; margin:2px; }
.mn:hover {
    -webkit-animation-name: gangorra;
    -webkit-animation-duration: .01s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
-moz-animation-name: gangorra;
    -moz-animation-duration: 0.1s;
    -moz-animation-timing-function: linear;
    -moz-animation-iteration-count: infinite;
    -moz-animation-direction: alternate;
-o-animation-name: gangorra;
    -o-animation-duration: 0.1s;
    -o-animation-timing-function: linear;
    -o-animation-iteration-count: infinite;
    -o-animation-direction: alternate;}
E para que o efeito apareça use esse código. Repita quantas vezes precisar e troque o que precise.
<a href="LINK_DO_BLOG" target="_blank" title="NOME_DO_BLOG"><img class="mn" src="URL_DA_IMAGEM" /></a>
Espero que seja últil para vocês, e agora que recebi meus dias de postagem podem aguardar por mim, toda quarta, quinta e fins de semana.
Bye bye

3 comentários:

  1. Bem vindo de volta
    Eu gostei do primeiro, é engraçado e bonitinho.

    ResponderExcluir
  2. Esse efeito Parce é lindo, quase fico uns dez minutos só passando o mouse em cima das imagens USHAUSHAU'

    ResponderExcluir
  3. Efeito parce é perfeitoo!

    - HTML Secret

    ResponderExcluir