Tuto: Efeito Flash (Divulgação)


Olá panteras! Trouxe para vocês o efeito que uso no gadget de divulgação daqui do blog. É esse efeito na imagem de luz, que parece flash, sabe? Acredito que tenha aprendido ele lá no Kawaii World.
Eu dei uma modificada nele quando passei ele para o TSD, espero que vocês curtam.
Visualize o efeito, clique aqui.
Vamos ao tuto?


01- Abra seu HTML.Procure por ]]></b:skin>. Acima da tag cole:

.eliteaff{
-webkit-transition: .2s;
border: #e8afd8 2px solid;
-webkit-filter:contrast(100%);
}
.eliteaff:hover{
-webkit-animation-name: flash; -webkit-animation-duration: 0.7s; -webkit-animation-iteration-count: 1; -webkit-transition-property: opacity; opacity: 1;-webkit-filter:contrast(140%); }
@-webkit-keyframes flash { 1% { opacity: 0.7; } 30% { opacity: 0.4; } 100% { opacity: 1; }}

Modifique aparte destacada em negrito. É a borda da imagem.

02-Depois vá em Layout. Abra um gadget de HTML/Javascript. Nele cole o seguinte código:

<a href="Link_Aqui" title="Nome"><img class="eliteaff" src="Link_Da_Imagem" /></a>

Modifique as partes destacadas em negrito e salve.

Espero que tenham gostado.
Beijos
Ana.

10 comentários:

  1. Que legal Flor amei *-*

    1ahistoria.blogspot.com.br :3

    ResponderExcluir
  2. Ficou bem legal, obrigado pelo tutorial! :)
    Seguindo seu blog! Se puder, retribui?

    www.elfosecreto.blogspot.com

    ResponderExcluir
    Respostas
    1. Obrigada! Assim que entrar no meu computador eu entro.

      Excluir
  3. Legal o efeito , fica legal para afiliados ! Acho que já sabia ele e tal , mas sempre é bom recordar e saber onde encontrar !

    Respondendo sua pergunta ; Quero ser irmão , posso ?

    '3' > http://semprefuiestranha.blogspot.com.br/

    ResponderExcluir
    Respostas
    1. Obrigada!
      Pode sim flor.
      Mas vou colocar assim que entrar no meu computador. No celular não dá pra fazer muita coisa né?

      Excluir
    2. Sim é verdade ! Obrigada !

      Excluir
    3. De nada flor.

      Excluir
  4. Muito fofo esse efeito,é ótimo para se usar em várias partes do blog,eu adorei ^^ vou usar no meu próximo lay na elite de afiliados

    paparazzibysuperstar.blogspot.com

    ResponderExcluir