05/09/2012

Tutorial: Efeito hover nas imagens

||

Yo minna san!!! Trago um tutu beeem maneiro procês de como colocar imagens opacas em todo o blog. Ele deixa o blog bem mimoso. Porém o lado ruim que as imagens das colunas, também ficarão opacas. Mas mãos a obra meus pandas! Lá dentro do seu HTML procure pela tag  ]]></b:skin>, e ai achou?
Agora cole esse código acima dele:

    /*---Efeito Opacidade*/
    .post img {
     -moz-opacity:0.60; opacity:0.60;/* Opacidade das imagens */
    -webkit-transition-duration: 2s; /* Tempo de mudação de uma imagem para outra */
    }
    .post img:hover {
    -moz-opacity:1.0; opacity:1.0;
    }
    .sidebar img {
     -moz-opacity:0.60; opacity:0.60;/* Opacidade das imagens */
    -webkit-transition-duration: 2s;
    }
    /*---Fim do código/

Só salvar e prontim. Gostou? Não esqueçam de comentar ficarei feliz em ver o seu blog.

Nenhum comentário:

Postar um comentário

Hi guys!!!!
Hey aqui é Wendy, blogueira desde 2010! Viciada em animes, amante de livros e adora ver séries! Criei esse cantinho na intenção de ajudar na criação e personalização de blogs e sites.
Wattpad Facebook Tumblr Instagram