este script não funciona.. completamente...... so funciona com o primeiro item...
o segundo não funciona....
agora se mudarmos o "nav" do primeiro para qualquer outro nome o segundo funciona......
eh como se o JS so reconhecesse a 1ª ocorrencia do "nav" ..
Não manjo quase nada de JAVASCRIPT.. .. entom se alg puder me dar um help.. agradeço....
o código eh o seguinte..
ah o arquivo barranav.css está em anexo.... e no firefox ele funciona perfeitamente... so com CSS mesmo.... (xxxxxx DE IE rsrsrs)
<html>
<head> <link rel="stylesheet" type="text/css" href="barranav.css"> </head>
<script language="JavaScript">
<!--
startList = function() {
if (document.all&&document.getElementById) {
navRoot = document.getElementById("nav");
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>
<table>
<tr>
<td> </td>
<td>
<ul id="nav">
<LI><a href="#"> teste </a>
<ul id="nav" class="sub">
<LI><a href="#">History</a></li>
<LI><a href="#">Team</a></li>
<LI><a href="#">Offices</a></li>
</ul>
</LI>
</ul>
</td>
<td>
<div><b>
<ul id="nav">
<LI><a href="#">About</a>
<ul id="nav" class="sub">
<LI><a href="#">History</a></li>
<LI><a href="#">Team</a></li>
<LI><a href="#">Offices</a></li>
</ul>
</LI>
</ul>
</b></div>
</td>
</TR>
</table>
</html>
[B]

Menu Dropdonw Não Funciona No Ie
Started By kurumim, 20/12/2005, 15:57
2 replies to this topic
#1
Posted 20/12/2005, 15:57
"Paz, Amor e Software Livre - Linux"
#2
Posted 20/12/2005, 19:15
O valor de um ID é único, não pode ter mais de um igual na página..
O que você pode fazer é colocar as duas lista (menus) em uma div com o ID nav, depois no script você pega as <li> do mesmo jeito que está fazendo..
O que você pode fazer é colocar as duas lista (menus) em uma div com o ID nav, depois no script você pega as <li> do mesmo jeito que está fazendo..
<div id="nav"> <ul> <li>xxxx</li> <li>xxxx</li> </ul> <ul> <li>aaaaa</li> <li>aaaaa</li> </ul> </div>
Fórum WMO - Equipe de Desenvolvimento / Banco de Dados - Ex-Administrador
#3
Posted 22/12/2005, 12:59
também não funcionou.. mas to com outro problema.. com a aplicação deste menu.... no fire fox ele funciona perfeitamente mas com CSS
no caso este que segue.. (q eh o arquivo barranav.css do script acima.. )
porém quero usá-lo em frames.. sendo q dai ele não funciona.. pois o sub menu q aparece qdo se posiciona o cursor em cima do menu so aparece no espaço limitado pelo frame "superior".. ou sej o frame superior tem q ter o tamanho do submenu... e não quero isso..
alg poderia me ajudar a resolver isso??
li:hover ul ul, li.over ul ul {
display:none;
}
li:hover ul, li li:hover ul, li.over ul,
li li.over ul {
display: block;
} /* Aqui a magica */
body {
font: normal 30px Verdana, Arial, Helvetica;
}
ul {
margin: 0;
padding: 0;
list-style: none;
width: 150px; /* Width of Menu Items */
}
ul li {
position:relative;
}
ul li a {
display: block;
text-decoration: none;
font-style: Verdana;
font-size: 16px;
color: #ffffff;
padding: 5px;
border-bottom: 0;
}
/* Fix IE. Hide from IE Mac \*/
* html ul li { float: left; height: 1%; }
* html ul li a { height: 1%; }
/* End */
ul li a:hover { color: #E2144A; background: #ffffff; } /* Hover Styles */
ul ul {
position:absolute;
display:none;
left: 0; /* Set 1px less than menu width */
top: 30px;
}
li ul li a {
color: #777;
font-size: 12;
background: #fff;
border: 1px solid #ccc;
padding: 2px 5px; } /* Sub Menu Styles */
li:hover ul ul, li.over ul ul { display:none; }
li:hover ul, li li:hover ul, li.over ul, li li.over ul { display: block; } /* The magic */
no caso este que segue.. (q eh o arquivo barranav.css do script acima.. )
porém quero usá-lo em frames.. sendo q dai ele não funciona.. pois o sub menu q aparece qdo se posiciona o cursor em cima do menu so aparece no espaço limitado pelo frame "superior".. ou sej o frame superior tem q ter o tamanho do submenu... e não quero isso..
alg poderia me ajudar a resolver isso??
li:hover ul ul, li.over ul ul {
display:none;
}
li:hover ul, li li:hover ul, li.over ul,
li li.over ul {
display: block;
} /* Aqui a magica */
body {
font: normal 30px Verdana, Arial, Helvetica;
}
ul {
margin: 0;
padding: 0;
list-style: none;
width: 150px; /* Width of Menu Items */
}
ul li {
position:relative;
}
ul li a {
display: block;
text-decoration: none;
font-style: Verdana;
font-size: 16px;
color: #ffffff;
padding: 5px;
border-bottom: 0;
}
/* Fix IE. Hide from IE Mac \*/
* html ul li { float: left; height: 1%; }
* html ul li a { height: 1%; }
/* End */
ul li a:hover { color: #E2144A; background: #ffffff; } /* Hover Styles */
ul ul {
position:absolute;
display:none;
left: 0; /* Set 1px less than menu width */
top: 30px;
}
li ul li a {
color: #777;
font-size: 12;
background: #fff;
border: 1px solid #ccc;
padding: 2px 5px; } /* Sub Menu Styles */
li:hover ul ul, li.over ul ul { display:none; }
li:hover ul, li li:hover ul, li.over ul, li li.over ul { display: block; } /* The magic */
"Paz, Amor e Software Livre - Linux"
1 user(s) are reading this topic
0 membro(s), 1 visitante(s) e 0 membros anônimo(s)