Efeito preto e branco nas imagens

Hoiii pessoal!

Hoje vou ensinar um efeito que aprendi no Vodca e Coca. É o efeito das imagens em preto e branco quando passa o mouse.

Aplicando o efeito na elite de afiliados:

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

]]></b:skin>

Acima disso, cole:

.pretoebranco {

border: 1px solid #eeeeee;

opacity: 0.6;

-webkit-transition: 0.5s;

text-align: center;

-webkit-transition-duration: .40s;

}

.pretoebranco:hover {

opacity: 1.0;

border: 1px solid #666666;

-webkit-filter: saturate(0%) ;

}

Quando quiser usar o efeito, use o código:

<a href="LINK DO BLOG" title=' TITULO AO PASSAR O MOUSE '><img src="LINK DA IMAGEM" class="pretoebranco" /></a>

Aplicando o efeito a todas as imagens do blog:

Acima de ]]></b:skin>, cole:

.post img {

border: 1px solid #eeeeee;

opacity: 0.6;

-webkit-transition: 0.5s;

text-align: center;

-webkit-transition-duration: .40s;

}

.post img:hover {

opacity: 1.0;

border: 1px solid #666666;

-webkit-filter: saturate(0%) ;

}

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