Tutorial - Efeito Detod

Yoo britânicas! Boa noite.

Bom, não tenho nada a declarar, então já falando sobre o assunto da postagem: Trouxe um tutorial pra vocês!

O tutorial de hoje, é um efeito que pode ser usado para elite de afiliados, eu achei muito fofo e delicado. Quem criou o efeito é o Diogo, do Wonderland Sky, portanto, créditos à ele, por esse efeito magnífico! °3°

Veja uma preview do efeito aqui.

Primeiro, você vai até o HTML do seu blog, clica na caixa dos códigos e da CTRL + F, e procurem pela tag ]]></b:skin>. Acima da tag, cole:

.mod {-webkit-transition: all 0.7s ease-out; -moz-transition: all 0.7s ease-out;-webkit-filter:grayscale(100%);outline-offset: -5px;outline: 1px solid #caa29a; /*Cor da linhazinha*/}.mod:hover {-webkit-transition: all 0.7s ease-out; -moz-transition: all 0.7s ease-out;-webkit-filter:grayscale(0%);outline-offset: -2px;outline: 1px solid #caa29a; /*Cor da linhazinha*/}

Faça as mudanças que achar necessário, como a cor da linha. Mas se quiser branco, deixa assim mesmo.

Em um gadget HTML/Javascript, cole o seguinte código:

<a href="LINK DA IMAGEM" title="TITULO DA IMAGEM" ><img src="URL DA IMAGEM" class="mod" /></a><a href="LINK DA IMAGEM" title="TITULO DA IMAGEM" ><img src="URL DA IMAGEM" class="mod" /></a>

Espero que tenham gostado do tutorial e do efeito! °3°