Oie eu voltei e ainda vou voltar hoje!
Vou voltar depois com papo mais sério okay?
Leia mais e veja as coisinhas
Entchão!
Muitas pessoas conhecem o tal "Menu de abas"
Hoje eu trouxe 3 tipos!
Normal(The Lovers)
E o especial!(Bad reputation)
Vamos ao primeiro:
Acesse seu painel do blog<>Entre na aba Layout<>E entre em Adicionar Gadget<>HTML/JavaScript
E cole o seguinte code:
<link href='http://naah-oliver.zip.net/menu2.css' media='screen' rel='stylesheet' type='text/css'/><script src='http://poisonedapple.awardspace.us/tabber.js' type='text/javascript'/>
Em outro gad get se cola:
<!-- Ínicio Menu Abas ~ By Drikoti.Net --><div class="tabber"><div class="tabbertab" title="Aba 1"><br>
Conteúdo 1</>
</div>
<div class="tabbertab" title="Aba 2">
<br />
Conteúdo 2</div>
<div class="tabbertab" title="Aba 3">
<br />
Conteúdo 3</div>
</div>
<!-- Fim Menu Abas ~ By Drikoti.Net -->
<center><br />
Entendendo:
Onde está em rosa choque ou seja no escrito Aba...Você coloca o titulo que vai aparecer na aba!Lembrando que a cor da aba principal é fixa um tom de creme e o escrito fica da cor dos links da side!
Onde está escrito Conteúdo...Você coloca o que vai estar escrito!
Eu recomendo colocar os seguintes títulos:
A Blogueira
Status
Afiliados ou créditos!
Curtiu?
Agora vamos ao segundo!
Esse precisa de HTML!
Vá no seu maravilhoso HTML de CTRL+F e procure por:
<head>
E logo depois desse código cole:
<!--- MENU DESLIZANTE --><script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'></script><script src='http://static.tumblr.com/ghoye6x/xBmloszst/colpaso.js' type='text/javascript'></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.addDiv('lion', 'fade=0,speed=400,group=pets,persist=1,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>
Vamos agora aplicar esse efeito?
Em um gadget de HTML/JavaScript cole:
<center><a href="#" rel="toggle[rabbit]" data-openimage="collapse.jpg" data-closedimage="expand.jpg">Título 1</a> |<a href="#" rel="toggle[dog]" data-openimage="collapse.jpg" data-closedimage="expand.jpg">Título 2</a> |<a href="#" rel="toggle[cat]" data-openimage="collapse.jpg" data-closedimage="expand.jpg">Título 3</a></center><div id="rabbit" style="display:none">Conteúdo do menu deslizante 1</div><div id="dog" style="display:none">Conteúdo do menu deslizante 2</div><div id="cat" style="display:none">Conteúdo do menu deslizante 3</div>
Curtiram?Volto logo girls!
Nenhum comentário:
Postar um comentário
Regras:
-Não aceitamos comentários Anônimos
-Sem estou seguindo segue de volta
-Não ofenda nenhuma pessoa
-Coloque a URL do seu blog ou semelhante ao final do comentário
-Sem SPAM
-Não serão aceitos comentários com excesso de caps lock (fixa)