21 junho 2013

Tutorial: Efeito Marquee & Rotate


Oii amorecos *u*
Hoje eu, a Helo, a Isa e a Ana (e mais a classe todas rs) tavamos na aula de artes, aih, a Helo viu um gato na sacado do prédio em frente da escola e a Ana falou que era uma sacola. E quando fui ver, ele se mexeu e falamos: "É.. uma sacola kkkk". E quando fui ver, a porta da sacada tava aberta, e tava passando um clipe do The Hangover Part III. kkkk Pura conhcidencia *w* 
Trouxe um tutorial bem legal, e é muito pouco conhecido, então vocês não devem conhece-lo
Ele se chama Efeito Marquee & Rotate, e você pode dar uma olhadinha nele, indo aqui. Dando créditos ao: Eu amo HTML pelo tutorial ;) Leia mais para seguir com o tuto
1°- Procurem por ]]></b:skin>, e depois que acho a tag, cole acima:

.isa-cute-rotate{border-radius: 10px; opacity:0.6; -webkit-transition-duration: .80s;}
.isa-cute-rotate:hover {opacity:1.0; -WEBKIT-TRANSFORM: ROTATE(-720DEG) SCALE(0.8); -webkit-transition-duration: .80s;}

Não precisa mexer em nada, só se quiser mudar as bordas. Mude o 10px para o número desejado (n°px)

2°- Vá em Layout • Adicionar Gadgets • HTML/JavaScript e cole:

<marquee behavior="alternate" onmouseout="this.start();" onmouseover="this.stop();" scrollamount="3">
<a href="LINK" title="TÍTULO"><img class="isa-cute-rotate" src="IMAGEM" /></a>
<a href="LINK" title="TÍTULO"><img class="isa-cute-rotate" src="IMAGEM" /></a>
<a href="LINK" title="TÍTULO"><img class="isa-cute-rotate" src="IMAGEM" /></a>
<a href="LINK" title="TÍTULO"><img class="isa-cute-rotate" src="IMAGEM" /></a>
<a href="LINK" title="TÍTULO"><img class="isa-cute-rotate" src="IMAGEM" /></a>
<a href="LINK" title="TÍTULO"><img class="isa-cute-rotate" src="IMAGEM" /></a>
<a href="LINK" title="TÍTULO"><img class="isa-cute-rotate" src="IMAGEM" /></a>
<a href="LINK" title="TÍTULO"><img class="isa-cute-rotate" src="IMAGEM" /></a>
<a href="LINK" title="TÍTULO"><img class="isa-cute-rotate" src="IMAGEM" /></a>
<a href="LINK" title="TÍTULO"><img class="isa-cute-rotate" src="IMAGEM" /></a>
</marquee>

-O número 3 destacado é a velocidade. E depois é só o que fazer que o código pede.
Conseguiram? Fico por aqui Xx
Malikisses

Nenhum comentário:

Postar um comentário

Oii! Antes de comentar leia as regras:
-Os comentários são sempre moderados, então pense 2 vezes antes de escrever merda.
-Nós não participamos de Tags.
-Não vamos revelar fontes ou tutoriais que usamos, então não insista.
-Sorteio ou concursos, são realizados conforme a meta
-Se quiser pedir alguma coisa, peça na Ask
-Respondemos TODOS os comentários, por isso, evite comentar em postagens antigas
-Falamos o que pensamos, mas não procuramos ofender.
-Os créditos estão no gadget
-Teste de tutorias serão realizados no blog: www.blogster-rascunho.blogspot.com
Agora, pode comentar =P Obrigada por visitar!!
Bjs - Helo&Rocky