09/01/2013

Tutorial - Efeito Flash


Yoo ~~ 

Trouxe um outro efeito que eu achei bem legal, é o efeito Flash.
Os créditos vão ao Kawaii World, ok ?  :3

Preview aqui.
E veja no gadget do efeito!


Enjoy ~~ 



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.


Gostaram?


Kissus o3o
E não se esqueçam de comentar ;D



11 comentários:

  1. Efeito lindão :3
    Kisses
    Sweet Cherry -> Perfil

    ResponderExcluir
  2. Vc ja esta no meu afiliados como prometido!
    http://blusinhabasica.blogspot.com.br/

    ResponderExcluir
  3. oi , eu adorei o seu blog super legal e de bom gosto ,ja estou te seguindo, sou nova por aqui , vizite me blog :www.anadepantufas.blogspot.com.br. bjinhos Ana De Pantufas .

    ResponderExcluir
  4. Oii, passei akie bem rápido para perguntar se da para você mudar a cor do Dream's de azul para cor de pele (aquele rosa bem claro) Porque eu estou pensando em mudar de cor do blog!!
    Obs: Lembra do blog que você fez aquele cabeçalho simples mais perffect!!O ultimo!! então é este mesmo!!
    Beijãão
    Miih ... http://sweet-dream-officer.blogspot.com.br/

    ResponderExcluir
  5. Aaaah, que liindo *-* Talvez seja útil para um noovo lay que eeu tôo planejando pro blog :p

    Seu bloog ée lindo, seguiindo :3

    release-ur-imagination

    ResponderExcluir
  6. Gostei muito desse efeito, Luuh *----* #Lindo
    Sonhos de Mel
    -M

    ResponderExcluir
  7. Amei, já tô usando no novo layout!
    E irei creditar vocês pois estou usando 2 efeitos que achei aqui ;D

    ResponderExcluir