16 de mai de 2013

Tutorial - Efeito Flipping

imagem: cl

1 - Vá em Editar HTML e procure pela tag <head> e cole abaixo:
<link href='http://static.tumblr.com/0xqvkot/MdKmj9am9/flippingkw.css' media='screen' rel='stylesheet'/>

2 - Procure por: ]]></b:skin> e acima da tag cole:
.efeitoflipping{ padding: 3px;}.efeitoflipping:hover{-webkit-backface-visibility: visible !important; -webkit-animation-name: flipping; -moz-backface-visibility: visible !important; -moz-animation-name: flipping; -o-backface-visibility: visible !important; -o-animation-name: flippink; backface-visibility: visible !important; animation-name: flipping;-webkit-animation-duration: 1s; }

3 - Por último, vá em Layout, em um gadget HTML/JavaScript e cole o código, substituindo o que está em negrito pela imagem da foto,o link e o nome do blog afiliado:
<a href="LINK" title="Nome do blog"><img src="LINK DA IMAGEM" class="efeitoflipping"/></a>
Gostaram?
Fonte: KW/AL

Um comentário:

  1. Tutorial super lindo! Gostei!

    lifeteeneditions.blogspot.com

    ResponderExcluir