Tuto: Efeito Gotinha

Sentiram a minha falta? Bem acho que não x)! Mas eu estou sempre, navegando na net, para achar coisas legais, para vocês, Girafinhas, bom achei no With You, um tuto, que ensina, como colocar um Efeito Gotinha, preview Aqui.

O efeito, está do lado, esquerdo, que está escrito Efeito Gotinha.

Então, vamos ao tutorial?

Se ficar interessado, click em Leia Mais

Vá em seu HTML, tecle Ctrl + F e procure por: ]]></b:skin>. Acima dessa tag, cole o código abaixo:

.bordinha {

padding: 1px; /* espaçamento da borda */

border: 1px solid #dad0cf; /* cor da borda */

border-radius: 100px 100px 100px 100px;

-webkit-transition-duration: .80s;

}

.bordinha:hover {

padding: 1px;

border: 1px solid #dad0cf; /* cor da borda hover */

border-radius: 100px 100px 0px 100px; /* não mude */

opacity: 0.80; /* opacidade mais baixa, se não quiser apague */

-webkit-transition-duration: .80s;

}

Agora em um Gadget HTML/JavaScript cole:

<center><a href="LINK AQUI" title="TÍTULO DA TOOLTIP"><img src="LINK DA IMAGEM" class="bordinha" /></a>

<a href="LINK AQUI" title="TÍTULO DA TOOLTIP"><img src="LINK DA IMAGEM" class="bordinha" /></a>

<a href="TÍTULO DA TOOLTIP" title="NOME"><img src="LINK DA IMAGEM" class="bordinha" /></a></center> 

Substitua o que está em negrito pelo que se pede. 

Bom espero, que tenham gostado!

Beijos doce da Lilly!