Bom, eu tinha dito para a Mandy-chan que eu iria algum dia reblogar algum tutorial dela, então estou cumprindo minha promessa, até porque os efeitos dela são demais. Eu já tentei fazer alguns efeitos só que descartei, foi tão lixo que odiei >////< Bom, os créditos vão para Mandy-chan de With You. Ahh e sobre os postadores nenhum ainda aceitaram meu convite, depois eu reclamo para eles direitinho o3o Leia mais para aprender os efeitos.
1. Vá até seu HTML, procure por ]]></b:skin> e cole acima:
@-webkit-keyframes vai { 0% { transform: rotate(0deg) scale(1.3) skew(0deg) translate(0px);-webkit-transform: rotate(0deg) scale(1.3) skew(0deg) translate(0px);-moz-transform: rotate(0deg) scale(1.3) skew(0deg) translate(0px);-o-transform: rotate(0deg) scale(1) skew(0deg) translate(0px);-ms-transform: rotate(0deg) scale(0) skew(0deg) translate(0px); }
25% {transform: rotate(-7deg) scale(1) skew(0deg) translate(0px);
-webkit-transform: rotate(-7deg) scale(1) skew(0deg) translate(0px);
-moz-transform: rotate(-7deg) scale(1) skew(0deg) translate(0px);
-o-transform: rotate(-7deg) scale(1) skew(0deg) translate(0px);
-ms-transform: rotate(-7deg) scale(1) skew(0deg) translate(0px);}
50% {transform: rotate(7deg) scale(0.964) skew(0deg) translate(-2px);
-webkit-transform: rotate(7deg) scale(1) skew(0deg) translate(0px);
-moz-transform: rotate(7deg) scale(1) skew(0deg) translate(0px);
-o-transform: rotate(7deg) scale(1) skew(0deg) translate(0px);
-ms-transform: rotate(7deg) scale(1) skew(0deg) translate(0px);}
75% {transform: rotate(-7deg) scale(1) skew(0deg) translate(0px);
-webkit-transform: rotate(-7deg) scale(1) skew(0deg) translate(0px);
-moz-transform: rotate(-7deg) scale(1) skew(0deg) translate(0px);
-o-transform: rotate(-7deg) scale(1) skew(0deg) translate(0px);
-ms-transform: rotate(-7deg) scale(1) skew(0deg) translate(0px);}
100% { transform: rotate(0deg) scale(-1) skew(0deg) translate(0px);-webkit-transform: rotate(0deg) scale(-1) skew(0deg) translate(0px);-moz-transform: rotate(0deg) scale(0) skew(0deg) translate(0px);-o-transform: rotate(0deg) scale(0) skew(0deg) translate(0px);-ms-transform: rotate(0deg) scale(0) skew(0deg) translate(0px);}}
.vai {border-radius: 5px; border:1px double #f5f5f5; margin:1px;cursor:pointer;}
.vai:hover {-webkit-animation: vai 1.3s alternate infinite linear;border-radius:2px;-webkit-transition: -webkit-transform 1s ease-in-out; }
2. Agora cole em um gadget HTML/Javascript:
<imgsrc="LINKDAIMAGEMAQUI" width="100" align="left" class="vai">
<imgsrc="LINKDAIMAGEMAQUI" width="100" align="left" class="vai"><imgsrc="LINKDAIMAGEMAQUI" width="100" align="left" class="vai"><imgsrc="LINKDAIMAGEMAQUI" width="100" align="left" class="vai">
Eu acho lindo esse efeito, muito fofinho.... Espera, agora que eu percebi que você usou um tutorial meu *O* OMG, muito obrigada sua fofaa <3
ResponderExcluirKiss
with-you-s2.blogspot.com
claro amor u3u
ExcluirDisse que um dia eu ainda ia reblogar -q hahaha'
-kissus-
Acho que será legal, amo tutoriais, sem falar que a cada um que vemos, os códigos parece fixar em nossas mentes, sei lá. Eu, infelizmente tenho uma reclamação! A live Preview não está prestando, pois quando clico vai para o blogger.com. Então, nem deu para eu ver...TT^TT. Chu ~♥.
ResponderExcluir- Prince Otaku
concertado o3o
ExcluirDeve ser lindo oo efeito, mas eu não consegui ver na live preview ç.ç
ResponderExcluirPequena Garota
concertei a live preview flor....
Excluir