Tutorial - Efeito Back

A ilustração ficou uma merda, mais ok -q

Boa noite pessoal ~

Tudo bem com vocês? Ultimamente eu tenho achado o blog meio 'zumbi', sei lá porque, estou achando ele bem paradão, mas ok, me culpem, a culpa é minha até porque eu estou demorando pra postar, mas vou ver se retomo, até porque minhas provas já acabaram, então tá tudo numa boa :)

Em relação a postagem, eu estava pensando em fazer um post explicando a mudança na área de HTML do blogger, mas aí eu parei pra pensar, e achei que já tem um monte de blog explicando como tá o HTML agora, então é só vocês verem por aí se estiverem em dúvida, muita gente já postou ><

Enfim, estou trazendo um efeito perfeito que eu achei no We Heart Html, e acho que vocês também vão achar esse efeito divo assim como eu -q , ele se chama Back sério ? .

Podem ver uma preview aqui :3

Procure por ]]></b:skin> e acima dele cole:

/*** efeito back por htmlstrew ***/ @-WEBKIT-KEYFRAMES PULSE {0% { -WEBKIT-TRANSFORM: SCALE(1); }50% { -WEBKIT-TRANSFORM: SCALE(1.1); }100% { -WEBKIT-TRANSFORM: SCALE(1); }} .moddib {background: url('urlimagem'); height: 100px; width: 133px; display: inline-block; -webkit-transition-duration: 0.5s; margin-left:10px;} .moddib:hover {background-position: right; -WEBKIT-ANIMATION: PULSE 1S;-MOZ-ANIMATION: PULSE 1S;-MS-ANIMATION: PULSE 1S; -webkit-transition-duration: 0.5s; }

No código,você só deve substituir o URL da imagem. Veja um exemplo com as medidas abaixo:

BC

Agora,para adicionar mais autores,coloque repita o código e troque o '.moddib' por '.moddib2', e assim vai, entenderam? Mas só repita a partir da tag que eu coloquei no exemplo,mesmo...

Para o efeito aparecer, cole o código apresentado no blockquote em um gadget:

<a href="link"><div class="moddib"></div>

Beeijos, amo vocês, e comentem :3