sábado, 12 de outubro de 2013

Galeria de afiliados e parceiros com efeito Opacity


Hoje vou disponibilizar no goodies mais um efeito para criar uma galeria de parceiros ou afiliados com efeito. Aprendi este efeito com bordas quadriculadas e como sempre gosto de modificar os códigos e deixa-los bem fofos desmembrei boa parte do código original e o deixei com este estilo, espero que gostem do novo resultado ^^...beijinhos!
Espero que gostem viu, aki não deu pra mim por certi o efeito
mas o efeito ao passar o mouse sera que todas as outras imagens ficaram brancas e a que vcs escolheu virara uma bolinha espero que gostem



                                                   

-------------------------------------------------------------------------------------
Copie o código abaixo  , cole antes de ]]></b:skin>




.afiliados img{-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;; width: 50px; }
.afiliados:hover img {-webkit-transition-duration: .45s; opacity: 0.20; }
.afiliados img:hover {-webkit-transition-duration: .45s; opacity: 1.0;

border:2px dashed #DB7093;
-webkit-transition: 0.5s;
-webkit-border-radius: 15px;
-moz-border-radius: 35px;
border-radius: 35px;} 


-------------------------------------------------------------------------------------
Agora copie o código abaixo  e cole em HTML/Java Script.


<center><div class="afiliados">

    <a href="ENDEREÇO DO SITE" target="_blank"title="Nome do site / Blog">
    <img src="http://i111.photobucket.com/albums/n159/docedani/fanlisting/9.png"></a>

    <a href="ENDEREÇO DO SITE" target="_blank"title="Nome do site / Blog">
    <img src="http://i111.photobucket.com/albums/n159/docedani/fanlisting/195.png"></a>

    <a href="ENDEREÇO DO SITE" target="_blank"title="Nome do site / Blog">
    <img src="http://i111.photobucket.com/albums/n159/docedani/fanlisting/219.png"></a>

    <a href="ENDEREÇO DO SITE" target="_blank"title="Nome do site / Blog">
    <img src="http://i111.photobucket.com/albums/n159/docedani/fanlisting/232.png"></a>



    <a href="ENDEREÇO DO SITE" target="_blank"title="Nome do site / Blog">
    <img src="http://i111.photobucket.com/albums/n159/docedani/fanlisting/164.png"></a>

    <a href="ENDEREÇO DO SITE" target="_blank"title="Nome do site / Blog">
    <img src="http://i111.photobucket.com/albums/n159/docedani/fanlisting/117.png"></a>

    <a href="ENDEREÇO DO SITE" target="_blank"title="Nome do site / Blog">
    <img src="http://i111.photobucket.com/albums/n159/docedani/fanlisting/133.png"></a>

    <a href="ENDEREÇO DO SITE" target="_blank"title="Nome do site / Blog">
    <img src="http://i111.photobucket.com/albums/n159/docedani/fanlisting/118.png"></a>



    <a href="ENDEREÇO DO SITE" target="_blank"title="Nome do site / Blog">
    <img src="http://i111.photobucket.com/albums/n159/docedani/fanlisting/108.png"></a>

    <a href="ENDEREÇO DO SITE" target="_blank"title="Nome do site / Blog">
    <img src="http://i111.photobucket.com/albums/n159/docedani/fanlisting/207.png"></a>

    <a href="ENDEREÇO DO SITE" target="_blank"title="Nome do site / Blog">
    <img src="http://i111.photobucket.com/albums/n159/docedani/fanlisting/236.png"></a>

    <a href="ENDEREÇO DO SITE" target="_blank"title="Nome do site / Blog">
    <img src="http://i111.photobucket.com/albums/n159/docedani/fanlisting/52.png" ></a>

    </div></center>


5 comentários:

  1. O efeito e Legal... Tenho um parecido no meu blog.
    Abraços.

    ResponderExcluir
  2. Muito fofo^^
    Vou te fazer uma pergunta^^
    Gosta da Banda Tókio hotel?

    ResponderExcluir
    Respostas
    1. Arigatoo fofa,
      Sobre a pergunta gosto sim da banda tókio hotel faz parte das minhas bandas favoritas

      Bjinhos

      Excluir
  3. Legal. Estou pensando em arrumar uma coisinha no ZOeO, e queria usar um efeito legal. Esse é legal!

    ResponderExcluir