Ir para conteúdo

Arquivado

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

godoy89

Problema com quebra de linha

Por , em Desenvolvimento frontend

Recommended Posts

William Bruno    1501

William Bruno
Postado

Não entendi oque significa:

"Quebrar essas linhas para baixo".

 

Pq você não faz em HTML? Menus em Imagem não são acessíveis.

Se ele não fecha, é problema de Javascript.

Compartilhar este post

Link para o post
Compartilhar em outros sites

godoy89    0

godoy89
Postado

Talvez eu não tenha explicado direito..

 

Em MILITARES e CIVIS eu preciso de sub-menus.

Colocando o mouse em cima deles (militares e civis) abre um submenu abaixo da imagem.

 

Repare que o "123" está logo abaixo da imagem e quando o submenu aparece, o "123" quebra as linhas.

 

O Submenu fecha só quando você desce o mouse, quando sobe ele continua ali.

 

 

 

Eu não preciso, necessariamente, arrumar esse script.

Se alguém tiver algum outro jeito de eu fazer isso funcionar, pode ser. Eu só preciso usar essas imagens.

 

Valeu!

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

Isso é por causa da imagem que aparece ali..

você não poderia fazer com HTML ?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="pt-br">
<head>
<style type="text/css">
* {
	margin: 0;
	padding: 0;
}
#menu {
	width: 100%;
	display: block;
}
#menu li {
	list-style: none;
	float: left;
	position: relative;
	padding: 0 5px;
}
#menu li ul {
	display: none;
	width: 800px;
}
#menu li:hover ul,
#menu li.over ul {
	display: block;
	position: absolute;
	top: 14px;
	left: 0;
}
#menu li ul li {
	display: inline;
	float: left;
	padding: 0;
}
</style>
<script type="text/javascript">
startList = function() {
if (document.all&&document.getElementById) {
	navRoot = document.getElementById("menu");
		for (i=0; i<navRoot.childNodes.length; i++) {
			node = navRoot.childNodes[i];
				if (node.nodeName=="LI") {
					node.onmouseover=function() {
					this.className+=" over";
				}
			node.onmouseout=function() {
		this.className=this.className.replace
	(" over", "");
   }
   }
  }
 }
}
window.onload=startList;
</script>
</head>
<body>
<ul id="menu">
	<li><a href="">Militares</a>
		<ul>
			<li><a href="">Blindados</a></li>
			<li><a href="">Caminhões</a></li>
			<li><a href="">Caminhonetas</a></li>
			<li><a href="">Carros</a></li>
			<li><a href="">Jeeps</a></li>	
			<li><a href="">Motos</a></li>
			<li><a href="">Trator</a></li>		
		</ul>
	</li>
	<li><a href="">Civis</a>
		<ul>
			<li><a href="">Caminhões</a></li>
			<li><a href="">Caminhonetas</a></li>
			<li><a href="">Carros</a></li>
			<li><a href="">Jeeps</a></li>	
			<li><a href="">Motos</a></li>
			<li><a href="">Trator</a></li>
		</ul>	
	</li>
	<li><a href="">Embarcações</a></li>
	<li><a href="">Aeronaves</a></li>
	<li><a href="">Anfíbios</a></li>
</ul><!-- /menu -->
	<p>123</p>
</body>
</html>
Caso os itens, devam ser imagens, basta recortar e colar cada um no seu próprio LI.

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