Ir para conteúdo

Arquivado

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

WSP8521

Menu drop-down vertical

Por , em Desenvolvimento frontend

Recommended Posts

WSP8521    0

WSP8521
Postado

OLA Pessoal,Criei um menu drop Dowv vertical só que não esta funcionado.

 

o codigo em html é este:

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pt-br" lang="pt-br">
<head>
<title>Navegação</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="menu_dropdown_vestical_(exercicio).css" rel="stylesheet" type="text/css" media="all" />
</head>
<body>
<ul id="menu">
<li><a href="#">Home</a></li>
<li><a href="#" class="submenu">Nossa Historia</a>
<ul>

	<li><a href="#">Historia da AICEB</a></li>
	<li><a href="#">historia da igreja</a></li>
</ul>
</li>
<li><a href="#" class="submenu">Estudos Biblicos</a>
<ul>
	<li><a href="#" class="submenu">Angeologia</a>
		<ul>

			<li><a href="#">Anjos</a></li>	
			<li><a href="#">Demonios</a></li>
		</ul>
	</li>
	<li><a href="#" class="submenu">Pneumatologia</a>
		<ul>
			<li><a href="#" class="submenu">Espirito Santo</a>

				<ul>
					<li><a href="#">Na vida de Jesus</a></li>	
					<li><a href="#">Na igreja</a></li>
				</ul>
			</li>
			<li><a href="#">Dons Espirituais</a></li>
		</ul>
	</li>

	<li><a href="#" class="submenu">Cristologia</a>
		<ul>
			<li><a href="#">vida de Jesus</a></li>
			<li><a href="#">Professias sobre Jesus</a></li>
			<li><a href="#">Oficios de Jesus</a>
				<ul>
					<li><a href="#">Profeta</a></li>

					<li><a href="#">Sacerdote</a></li>
					<li><a href="#">Rei</a></li>
				</ul>
			</li>
		</ul>
		</li>
	<li><a href="#" class="submenu">Apologetica</a>

		<ul>
			<li><a href="#" class="submenu">Igreja Catolica</a>
				<ul>
					<li><a href="#" class="submenu">Mariologia</a>
						<ul>
							<li><a href="#">Maria</a></li>

						</ul>

					</li>
					<li><a href="#">Papa</a></li>
				</ul>
			</li>
			<li><a href="#" class="submenu">IASD</a>
				<ul>
					<li><a href="#">Questao do Sabado</a></li>

					<li><a href="#">LEI</a></li>
					<li><a href="#">Ellen Whaite</a></li>
				</ul>
			</li>
		</ul>
	</li>
</ul>
</li>


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

</ul>
</body>
</html>

 

agora o codigo em css

 

	    
ul#menu, ul#menu li ul{
font:12pt  Verdana, Arial, Helvetica, Sans-serif;
margin:0;
padding:0;
list-style:none;
width:10em;
border:solid #ccc;
border-width:0 1px 1px;
}


/*criando contexto de posicionamento para os submenus*/
ul#menu li{position:relative}

/*posicionamento dos submenus*/
ul#menu li ul{
position:absolute;
left:10em;
top:0;
display:none; /*esconde os submenus*/	    
}
ul#menu li a, ul#menu ul li a{
		display:block;
		text-decoration:none;
		color:#666;
		padding:0.25em 0.5em 0.25em 0.75em;
		border-top:1px solid #ccc;
		}
ul#menu li.submenu {
	background:transparent url(seta.gif) no-repeat right;
	}

/*\*/
*html ul li{float: left;height:1%}
ul#menu li:hover ul,ul#nav li.over ul{display:block;} /*revela o submenu*/

ul#menu li.over ul li ul, /* utilizado no IE6*/
ul#menu li:hover ul li ul { display:none} /*utilizado nos navegadores padrao*/

ul#menu li.over ul li.over ul li, /* utilizado no IE6*/
ul#menu li:hover ul li:hover ul{display:block}

 

pós bem, o meu problema é que os submenus que estão dentro de ouro submenu aparecem de uma ves como por exemplo no menu Apologetica.

 

gostaria de saber onde estou errando.

 

Agredeço

Compartilhar este post

Link para o post
Compartilhar em outros sites

Evandro Oliveira    331

Evandro Oliveira
Postado
http://forum.imasters.com.br/index.php?/topic/416764-adicionar-um-submenu-no-submenu/page__p__1640975entry1640975

Compartilhar este post

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

Informação importante

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

  Aceito