10 de ago de 2013

Efeito opacidade (em hover)

*Essa postagem é programada, mesmo assim estou lendo os comentários e respondendo as perguntas, só não digitei exatamente agora*

Estou trazendo um tutorial muito simples e conhecido que é o do efeito opacidade quando passa o mouse. Diferente dos outros que temos aqui no blog, esse efeito deixa a imagem opaca somente depois de passar o mouse. E continua opaca mesmo depois de tirar o mouse de cima da imagem. O efeito é muito simples e bonito, e fica lindo em elite de afiliados mais simples.
Veja um exemplo dele aqui.


Em um Gadget de HTML/JavaScript, cole:

<a href="LINK DO BLOG"  target="_blank" text-decoration:none; title="NOME DO BLOG"><img class="borderimage" onmouseout="this.style.opacity=0.5;this.filters.alpha.opacity=50" onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100" src="LINK DA IMAGEM" /></a>

Simples não?

6 comentários:

  1. Otimo o tuto ^^

    xoxo, domis
    # cute-bii.blogspot.com | icons-bii.blogspot.com

    ResponderExcluir
  2. Eu estou num baita in love com esse layout. MDS! Combinação de cores perfeitas, além de estar super original! haha Tem um tempão que eu não venho aqui, né? Reconheci pelo modelos das ilustrações, haha. Acho esse tutorial bem diferente, porque ficar opaco mesmo que você tire o mouse, *3* Beijos!

    ResponderExcluir
  3. Já conhecia o efeito, fica bem bonito ^^

    ResponderExcluir

Seja educado, não use palavras ofensivas ou de baixo calão;
Comente algo relacionado ao post, para outros assuntos use a ask;
Obrigada e volte sempre!