18/07/2013

Efeito Sunday


Yo babys! Como estão? Nossa quantos comentários vocês fizeram estou louca para moderar porem ainda estou em viajem bubu... Falta apenas duas duas provas para mim voltar pra casa wheeeee!!! Mas hoje venho postar um efeito bem legal, simples mas legal. Por alguma razão gosto de coisas simples sem muita coisa chamativa acho tão fofo. O efeito se chama Sunday hihi achei engraçadinho, mas vou parar de amolar vocês e vamos ao tutorial ne?


1. Vá ate seu HTML e procure por ]]></b:skin>, acima dele cole:
Códigos
    @-webkit-keyframes nen {
    0% {-webkit-transform:  rotate(1deg);}
    25% {-webkit-transform:  rotate(10deg);}
    50% {-webkit-transform:  rotate(1deg);}
    100% {-webkit-transform:  rotate(10deg);}
    }
    @-moz-keyframes nen {
    0% {-webkit-transform:  rotate(1deg);}
    25% {-webkit-transform:  rotate(10deg);}
    50% {-webkit-transform:  rotate(1deg);}
    100% {-webkit-transform:  rotate(10deg);}
    }
    @-o-keyframes nen {
    0% {-webkit-transform:  rotate(1deg);}
    25% {-webkit-transform:  rotate(10deg);}
    50% {-webkit-transform:  rotate(1deg);}
    100% {-webkit-transform:  rotate(10deg);}
    }
    .nen { -webkit-transition: .2s; -webkit-border-radius: 1px; -webkit-border-bottom-right-radius: 10px; -moz-border-radius: 1px; -moz-border-radius-bottomright: 10px; border-radius: 1px; border-bottom-right-radius: 10px;
    box-shadow: 0px 1px #d15e93;}
    .nen:hover { -webkit-animation: nen .2s alternate infinite linear; -webkit-border-radius: 1px;-webkit-border-bottom-right-radius: 5px;-moz-border-radius: 1px; -moz-border-radius-bottomright: 5px; border-radius: 1px; border-bottom-right-radius: 5px; }


2. Vá ate seu layout e crie um novo gadget de HTML. Dentro dele cole o código abaixo e arrume as parte em negrito:

Códigos
<center><a href="LINK" title="Vaga"><img class="nen" src="http://i.imm.io/1aq9R.png" /></a>
<a href="LINK" title="Vaga"><img class="nen" src="http://i.imm.io/1aq9R.png" /></a>
<a href="LINK" title="Vaga"><img class="nen" src="http://i.imm.io/1aq9R.png" /></a></center>

Prontinho!!!! Espero que tenham gostado os créditos são do blog WOT ate aproxima pessoal beijokas.

6 comentários:

Bem Vindos
Hi! Meu nome é Andréa Alark, mas conhecida como Wendy dona do blog Bunny Crazy. O blog foi criado em 2010 na intenção de ajudar a criação e desenvolvimento do seu blog. Aqui encontrará tutoriais e dicas de HTML, layouts gratuitos e muito mais.
Friends
Bunny Crazy by Wendy ❀
Bunny Crazy ★
Bunny Crazy ★
12345