Efeito de opacidade nas imagens

Bom dia pessoal! Hoje trago um tutu bem facil para vocês. Algo que o pessoal anda usando mundo em imagens de afiliados, que deixa uma aparencia mais detalhada no blog. Tem varias formas de colocar. Ela ficara mais ou menos assim, dependendo da intensidade que você desejar.

1. Se você desejar colocar apenas em algumas imagens do seu blog use esse codigo:

Códigos

 <a href="LINK DO SITE" target="_blank"><img onmouseout='this.style.opacity=0.4;this.filters.alpha.opacity=40' onmouseover='this.style.opacity=1;this.filters.alpha.opacity=100' style='opacity: 0.4;' src="URL DA IMAGEM" border="0" /></a><br />

Agora se quiser colocar em todos os afiliados de uma única vez: siga esse tutorial:

Design >> Designer de modelo do Blogger  (Antiga interface)
Modelo >>Personalizar >> Prosseguir (Nova interface)

1. No  HTML procure por:

 ]]></b:skin>

2. E acima dele cole isso:

Códigos

#abc img{
opacity: .3;
 filter:alpha(opacity=30);
 -moz-opacity: 0.3;
 -khtml-opacity: 0.3;
 background:#fff;
}
 #abc img:hover
{
opacity:5.0;
 filter:alpha(opacity=500);
-moz-opacity: 5.0;
 -khtml-opacity: 5.0;
  }

3. Salve e prontinho, agora quando quiser usar o efeito use esse código:

Códigos

<div id="abc"> <a href="LINK DO SITE" target="_blank"><img src="URL DA IMAGEM" border="0" /></a><br/> </div>