Efeito opacidade em uma imagem

Categoria:

Tutorial feito por mim, por favor dê os créditos.
É um efeito bem legal que deixa sua imagem com opacidade, vai deixa os elementos do blog mais cute e dinâmico *-*. O que vamos aprender é fazer com que a imagem fique assim:

star spangled banner flag house, tutorial de hatml Efeito transparência em uma imagem

Obs: a imagem fica assim, mas quando passa o mouse em cima ela volta a cor normal, faça o teste nessa imagem de cima ;)
Para colocar esse efeito em uma imagem de um post faça o seguinte:

  • Quando você postar vá na aba "HTML", que está na própria postagem, e cole o seguinte código no lugar que você queira que a imagem apareça:
    • <img onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100" onmouseout="this.style.opacity=0.8;this.filters.alpha.opacity=50" style="opacity: 0.5; " src="ENDEREÇO DA IMAGEM"/>

      • Troque ENDEREÇO DA IMAGEM, pelo url da imagem. E visualize.
      • Mas se você quiser por em uma gadget vá em Design Adicionar uma Gadget, e escolha "HTML/JavaScript", e cole o mesmo código que está ali em cima.
      • Pronto!