Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Arrasted

escondido e ao clicar aparece

Por , em Javascript

Recommended Posts

Arrasted    0

Arrasted
Postado

tenho um menuzinho em css (ul com varias li's dentro certo?

Eu tenho um link no menu: calcados e varios outros sub-itens que aparecem abaixo dele, tipo: sapatos, tennis, sandalias, etc.

Eu gostaria de esconder esses sub-itens através de display: none... talvez? esses sub-itens gostaria que so fossem mostrados quando o link sapatos for clicado.

alguém pode me ajudar?

é tipo esse www aqui. http://www.acaciamadeiras.com.br ou no blog do bruno

http://www.brunodulcetti.com/blog/category/css/

 

valeu pessoal,

Compartilhar este post

Link para o post
Compartilhar em outros sites

Arrasted    0

Arrasted
Postado

tenho um menuzinho em css (ul com varias li's dentro certo?

Eu tenho um link no menu: calcados e varios outros sub-itens que aparecem abaixo dele, tipo: sapatos, tennis, sandalias, etc.

Eu gostaria de esconder esses sub-itens através de display: none... talvez? esses sub-itens gostaria que so fossem mostrados quando o link sapatos for clicado.

alguém pode me ajudar?

é tipo esse www aqui. http://www.acaciamadeiras.com.br ou no blog do bruno

http://www.brunodulcetti.com/blog/category/css/

 

valeu pessoal,

<script>

function mostraesconde(campo) {

document.getElementById(campo).className = document.getElementById(campo).className == 'hidden' ? 'visible' : 'hidden';

}

</script>

 

 

pensei em algo assim, pelo que vi no fórum:

<ul id="menu">

<li><a href="#" onclick="mostraesconde('m9')">Madeiras »</a></li>

</ul><!--end ul menu -->

 

<div id="m9" class="hidden">

<li><a href="#">Peróba Verm. (Guajará)</a></li>

<li><a href="#">Peróba Rosa</a></li>

<li><a href="#">Garapeira</a></li>

<li><a href="#">Cedrinho</a></li>

<li><a href="#">Pinus</a></li>

<li><a href="#">Eucalito Roliço</a></li>

</div><!-- end m9 -->

 

<ul id="menu">

<li><a href="#" onclick="mostraesconde('m9')">Chapas e Lâminas »</a></li>

</ul><!--end ul menu -->

 

<div id="m9" class="hidden">

<li><a href="">Forma Resinada</a></li>

<li><a href="">Forma Fenólica</a></li>

<li><a href="">Forma Plastificada</a></li>

<li><a href="">OSB</a></li>

</div><!-- end m9 -->

 

agora, a peste ta mostrando o mesmo conteudo( o primeiro conteudo que esta escondido) ...isso é pq eu nao posso usar um div duas vezes correto ?

Compartilhar este post

Link para o post
Compartilhar em outros sites

Megadeth    2

Megadeth
Postado

Cara fiz esse script vê se é o que você precisa.

<html><head><title>Untitled Document</title><script>function mostraesconde() {	visivel = document.getElementById('campos').style.display;	if(visivel == "none")		document.getElementById('campos').style.display = "block";	else		document.getElementById('campos').style.display = "none";}</script><style type="text/css">#campos {position: absolute;display: none;}</style></head><body><ul><li><a href="#" onClick="mostraesconde()">Indice</a>	<div id="campos">	<li><a href="#">Campo 1</a></li>	<li><a href="#">Campo 2</a></li>	<li><a href="#">Campo 3</a></li>	<li><a href="#">Campo 4</a></li>	</div></li></ul></body></html>
é só adptar segundo a sua necessidade.Senão conseguir posta ai.

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito