Como fazer efeito single nos afiliados

para ver click em mais coisinhas

PREVIEW

Procure por ]]></b:skin> e acima dessa tag cole:

@-webkit-keyframes bubble {
 25%   { -webkit-transform: rotate(-50deg); } 40%{ -webkit-transform: scale(0.5);}
50% { -webkit-transform: rotate(50deg); }}
@-moz-keyframes bubble {
25%   { -webkit-transform: rotate(-50deg); } 40%{ -webkit-transform: scale(0.5);}
50% { -webkit-transform: rotate(50deg); }}
@-o-keyframes bubble {
25%   { -webkit-transform: rotate(-50deg); } 40%{ -webkit-transform: scale(0.5);}
50% { -webkit-transform: rotate(50deg); }}
@-ms-keyframes bubble {
25%   { -webkit-transform: rotate(-50deg); } 40%{ -webkit-transform: scale(0.5);}
 50% { -webkit-transform: rotate(50deg); }}

.bb{
padding:1px;
}
.bb:hover{
-webkit-animation: bubble 1s;
-moz-animation: bubble 1s;
-o-animation: bubble 1s;
-ms-animation: bubble 1s;
}

Não há nem o que explicar dessa vez. O código é mais ou menos pequeno, e nele só tem o que é necessário para o efeito funcionar, então não precisa mexer em nada. Depois, adicione um gadget de HTML/Javascript e cole:

<a href="LINK DO BLOG" title="NOME DO BLOG"><img src="LINK DA IMAGEM" class="bb" /></a>

Vá adicionando o código acima quantas vezes quiser, para a quantidade de imagens que quiser.
Pronto! O efeito é super fácil e o código é bem pequeno (milagre) já que a maioria dos efeitos que faço o código acaba ficando um monstro gigante. Confesso que gostei de trabalhar com keyframe, e recomendo pra todo mundo. É bem fácil e prático.

Espero que tenham gostado. Beijos ♥