Olá my cupcakes :3 . Tudo bom?Comigo tudo ótimo...Hoje trago um efeito super legal chamado "Fall".Quem não sabe o que é clique aqui e veja está no 5º gadget.Gostou e quer aprender?Clique em "Leia Mais" e aprenda!
Tutorial Crédite: Kawaii World.
Vamos começar ao tutorial!?!
1. Vá até modelo > Editar HTML e clique em qualquer lugar da caixinha com os códigos. Pressione ctrl + F e procure por <head> que deve se encontrar mais ou menos na quarta linha. Abaixo dessa tag que você acabou de encontrar, cole o seguinte:
<link href='http://static.tumblr.com/dlelfro/wZfml3zxq/fallingkw.css' media='screen' rel='stylesheet'/>2. Agora vá descendo até encontrar a primeira setinha, onde tem <b:skin>...</b:skin>. Se preferir, use o ctrl + F e procure por ... e aí você irá achar a seta. Clique nela. Pressione ctrl + F e procure por ]]></b:skin>. Acima dessa tag, cole o seguinte:
.efeitofall{
padding:2px;
border:1px solid #dcdbdb;
}
.efeitofall:hover{
-webkit-animation-name: fall;
-moz-animation-name: fall;
-o-animation-name: fall;
animation-name: fall;
-webkit-animation-duration: 1s;
}
3. Você já pode salvar. Para aplicar o efeito em alguma imagem, utilize o código abaixo dentro de um gadget de HTML/JavaScript. Serve para imagens e menus, faça um bom uso. Substitua as partes indicadas.
<a href="LINK""><img src="LINK DA SUA IMAGEM" class="efeitofall"/></a>
E ai gostaram do tutorial?Espero que sim.Kisses...
/Juuh
Nenhum comentário:
Postar um comentário