Seja bem vindo(a) ao Sugoi tutoriais =)
Temos temas para blogger, wordpress e outros!
Acompanhe nosso blog pela FANPAGE!
Peça o seu tutorial aqui!

2/14/2013

Menu Deslizante {Mais/Menos}

Gente , eu vi que vários blogs usam esse menu confiram a prévia dele abaixo e clique em mais informações para conferir o tutorial {códigos por :Having Themes}

Mais/Menos

1 - Vá em > Modelo > Editar HTML e procure por <*/body> e cole esse código
<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>
2 - Apos fazer isso cole esse código onde quer que apareça Exemplo : Post ou Gadgets

<a href="javascript:animatedcollapse.toggle('cat')">
<b>Clique</b>
</a>
<div id="cat" style="display: none; " groupname="pets" speed="400">
Coloque o conteúdo aqui.
</div>

Tutorial Feito por : Sugoi Tutoriais | Códigos Por : Having Themes

Nenhum comentário:

Postar um comentário

Seja educado , nossa educação depende da sua.
Criticas e sugestões são bem vindos.
Se reblogar por favor nos avise.