Tutorial - Conteúdo Escondido

Oi meus amores,aqui é a Laura :3

Hoje vou ensinar como esconder um conteúdo.

Para aprender clique em leia mais :3

Nível de Dificuldade: Fácil

Entendendo

Nesse tutorial,iremos criar algo que ao clicar aparece o conteúdo.Assim:

Como Fazer

1- Vá em Modelo >> Editar HTML

2- Aperte CTRL + F e procure por:

</head>

3- Acima, cole:

<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/2wl9p6g/G70lj5t0q/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>

4-  Salve.

5- Vá para Layout >> Adicionar um novo Gadget(HTML/Javascript) e cole:

<a href="javascript:animatedcollapse.toggle('dog')"><img src="URL da Imagem"/></a>

<div id="dog" style="display:none">Conteúdo escondido</div>

6- Onde está escrito URL da Imagem é para colocar o url da imagem que ao clicarmos aparecerá o conteúdo escondido.E onde está escrito Conteúdo escondido,é para colocar o que você quer esconder,pode ser um texto,uma imagem,o que você quiser.

7- Salve e está pronto.

Gostaram do tuto? Aprendi no Sweet Poison.

Beijos e tchau tchau :3