Efeito desfoque nas imagens

Oi pessoal!

Hoje vou ensinar a aplicar o efeito de desfoque nas imagens quando passa o mouse. É ótimo para elite de afiliados e para dar uma variada ;)

Veja um preview aqui.

1- Vá no HTML do seu blog, aperte CTRL+F e procure por:

/b:skin

Acima disso, cole:

.Desfoquetty {width:55px; padding:4px; -webkit-transition: all 0.4s ease;-moz-transition: all 0.4s ease;-o-transition: all 0.4s ease;transition: all 0.4s ease;}.Desfoquetty:hover { -webkit-transition: all 0.4s ease;-moz-transition: all 0.4s ease;-o-transition: all 0.4s ease;transition: all 0.4s ease;-webkit-filter: blur(2px); color:#fff;}

Para aplicar o efeito, use o seguinte código:

<a href="LINK DO BLOG" title=' TITULO AO PASSAR O MOUSE ' onmouseover="ddrivetip('havingthemes')" ;="" onmouseout="hideddrivetip()"><img src=" URL DA IMAGEM  " class="Desfoquetty" /></a>

Veja um exemplo. (Gadget "desfoque" na barra lateral).

Para aplicar em todas as imagens do blog:

.post img {
width:55px;
padding:4px;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all 0.4s ease;
}
.post img:hover {
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all 0.4s ease;
-webkit-filter: blur(2px); color:#fff;
}

Meus querides! Caso vocês gostem desse blog e queiram continuar me acompanhando, eu ainda escrevo, mas em outro blog. Não posto apenas tutoriais, mas continuo escrevendo e falando de vários assuntos, inclusive a blogosfera. Caso queira visitar (sério ótimo uma visita): clique aqui para ir ao blog Serenar