Irei dar uma breve explicação sobre a propriedade opacity, que traduzida a palavra ao Português, quer dizer: opacidade; Voltando a explicação, a propriedade opacity faz parte do conjuto de propriedades em HTML e JS, cuja ao usar a propriedade não é necessário criar duas ou três imagens, mais somente adicionar a propriedade junta com seus elementos de transição e pronto.
Código:
Efeito Desclareamento
<a href="Link"><img onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100" onmouseout="this.style.opacity=0.5;this.filters.alpha.opacity=50" style="opacity: 0.5;" src="Url-da-Imagem" /></a>
Efeito Clareamento
<a href="Link"><img
onmouseover="this.style.opacity=0.5;this.filters.alpha.opacity=50"
onmouseout="this.style.opacity=1;this.filters.alpha.opacity=100"
style="opacity: 1;" src="Url-da-Imagem" /></a>
Obs.:
Link = Propriedade equivalente onde você deve modificar para mostrar o direcionamento de página online ou offline donde o usuário clique e vá seguir.
Url-da-Imagem = Equivale ao endereço da imagem.
Em todas as imagens
Caso você queira adicionar esses efeitos em todos as imagens pertencentes ao blog, criamos um tutorial, caso queira vê-lo, clique aqui