Hey! Sou Erica do blog Garotas e Derivados e estou postando a partir de agora aqui. Sempre gostei de descobrir tutoriais para mudar meu blog e tudo mais, mas nunca tive 'coragem' para criar um blog de com este assunto. Mas agora estou tendo a oportunidade de postar alguns tutoriais e passar pra vocês o que eu sei.
O meu 1º tutorial é como colocar um menu deslizante (que você pode utilizar para colocar c-box e derivados) no seu blog, igual a este do meu humilde blog de testes...

Para começar vá em Design e depois Editar HTML e aperte Ctrl + f e escreva <head> e cole o codigo abaixo

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript" src="http://static.tumblr.com/enpbtf0/a8olor0ey/animatedcollapse.js"></script> <script type="text/javascript"> animatedcollapse.addDiv('jason', 'fade=1,height=80px') animatedcollapse.addDiv('kelly', 'fade=1,height=100px') animatedcollapse.addDiv('michael', 'fade=1,height=120px') animatedcollapse.addDiv('cat', 'fade=0,speed=400,group=pets') animatedcollapse.addDiv('dog', 'fade=0,speed=400,group=pets,persist=1,hide=1') animatedcollapse.addDiv('rabbit', 'fade=0,speed=400,group=pets,hide=1') animatedcollapse.ontoggle=function($, divobj, state){ //fires each time a DIV is expanded/contracted //$: Access to jQuery //divobj: DOM reference to DIV being expanded/ collapsed. Use "divobj.id" to get its ID //state: "block" or "none", depending on state } animatedcollapse.init() </script>

Agora você adiciona um gadget 'HTML/Javascript' e cola este código

<a href="javascript:animatedcollapse.toggle('cat')"> <div class="h4"><b>CLIQUE</b> </div> </a> <div id="cat" style="display: none; " groupname="pets" speed="400"> Conteúdo aqui</div>

Toque o que esta em roxo pelo titulo que você quer que apareça e troque o que esta em rosa pelo conteúdo. Este tutorial eu achei no Designs Forever, todos os créditos a ele.
Dúvidas? Só comentar que eu respondo nos comentários *-*
Bezôôs,
Erica Judd


4 coments:

Roberta :3 disse... Reponder {}

Super legal o tutorial!!!
beijus<3

Evelyn VR disse... Reponder {}

@Roberta :3 verdade, a Érica é muito boa, os tutoriais são incríveis !!

Gabriel disse... Reponder {}

escurece um pouquinho a cor da letra , naum to conseguindo ler direito!

Playson disse... Reponder {}

:b

Postar um comentário

:a   :b  :c  :d  :e :f  :g  :h  :i  :j  :k  :l  :m  :n  :o  :p  :q  :r  :s  :t  :u

Comentar não dói!