Efeito Awake

28 de jul de 2013


Vá no modelo do seu blog, aperte F3 e pesquise por ]]></b:skin>.
Após achar a tag, cole acima dela o seguinte código:


@-webkit-keyframes awake {
10% {-webkit-transform: translatey(-5px);}
100% {-webkit-transform: translatey(-10px);}
100% {-webkit-transform: scale(1.1);}
0% {-webkit-transform: rotate(-5deg); }
25% {-webkit-transform: rotate(40deg); }
100% {-webkit-transform: rotate(-40deg); }
}
@-moz-keyframes awake {
10% {-webkit-transform: translatey(-5px);}
100% {-webkit-transform: translatey(-10px);}
100% {-webkit-transform: scale(1.1);}
0% {-webkit-transform: rotate(-5deg); }
25% {-webkit-transform: rotate(40deg); }
100% {-webkit-transform: rotate(-40deg); }
}
@-o-keyframes awake {
10% {-webkit-transform: translatey(-5px);}
100% {-webkit-transform: translatey(-10px);}
100% {-webkit-transform: scale(1.1);}
0% {-webkit-transform: rotate(-5deg); }
25% {-webkit-transform: rotate(40deg); }
100% {-webkit-transform: rotate(-40deg); }
}
.awake {-webkit-transition: .7s; border-radius: 10px; box-shadow: 1px 1px #d6d6d6;box-shadow: inset 0 0 18px #ffe4e1, 0 0 3px #FFD1CC}
.awake:hover {-webkit-animation: awake .7s alternate infinite linear;
box-shadow: inset 0 0 18px #ffe4e1, 0 0 3px #FFD1CC;border-radius: 35px;}
Salve. Depois, vá no layout do seu blog, adicione um novo gadget de HTML/JS e cole:
<a href="LINK_DA_COISA"><title="TITULO_DA_COISA"<img class="awake" src="LINK_DA_IMAGEM" /></a>
Altere as partes destacadas com o que se pede. Salve e pronto.


Se esse Tuto for seu me avise...

3 comentários :

Maria Luiza disse...

Adorei o tutorial, você poderia fazer o tutorial do menu desse layout?
Obg

:)

http://blog-da-malu-ka.blogspot.com.br/

Thamiris Lara disse...

Oie faço sim...Como não foi eu que fiz o Menu farei algumas modificações então amanha eu Posto Okay?

Bjs:)

Maria Luiza disse...

Ok e obg
Bjs

Postar um comentário

Seu Comentários é sempre bem vindo!
Comente,opine,se expresse! Este espaço é seu!
Comentar faz parte,então por favor deixem comentários

-Todos os comentários são moderados e só ficarão disponíveis ao serem aprovados
-A área de comentários não é casa da mãe Joana,então tenha respeito.Não use palavrões,nem insultos,ofensas,agressões e baixarias;
-Não serão aceitos comentários Anônimos,comentários repetidos,e que tenham qualquer material publicitários ou de merchandising pessoal ou de benefício de terceiros
-Contatos pessoais devem ser feitos na pagina de contato.
-Não deixe links desnecessários os comentários

AVISOS:

--Blog não é Chat,respeitadas as regras ,é livre o debate dos assuntos aqui postados,Que o espaço de comentários não sirva para bate papo sobre assuntos de caráter pessoal ou estranhos ao blog
--A tentativa de clonar nomes e apelidos de outros usuários para emitir opiniões em nome de terceiros configura crime de falsidade ideológica.

Espero que tenham gostado do blog e que volte sempre!