No tuto diz que é preciso alguns trâmites para enganar o IE, entretanto, mesmo colocando-os, continua a dar erro. Eu sinceramente não compreendo o erro, sendo que tudo foi feito na base do ctrl+c ctrl+v.
Aproveitando, os sub-menus do menu ficam por baixo do texto de uma div, e, mais uma vez, não sei o porquê (não entendo muito de position).
Estou desde as 15h tentando desvendar isto, caso alguém possa averiguar:
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title> </title>
<script type="text/javascript" src="drop_down.js"></script>
<style type="text/css">
body {
font-family:"Tahoma";
font-size:9px;}
ul#primary-nav,
ul#primary-nav ul {
margin: 0;
padding: 0;
width: 172px; /* Width of Menu Items */
border-bottom: 1px solid #C6DDC6;
background: #deebde; /* IE6 Bug */
font-size: 100%;
}
ul#primary-nav li {
position: relative;
list-style: none;
}
ul#primary-nav li a {
display: block;
text-decoration: none;
color: #001;
padding: 5px;
border: 1px solid #c6ddc6;
border-bottom: 0;
}
/* Fix IE. Hide from IE Mac \*/
* html ul#primary-nav li { float: left; height: 1%; }
* html ul#primary-nav li a { height: 1%; }
/* End */
ul#primary-nav ul {
position: absolute;
display: none;
left: 171px; /* Set 1px less than menu width */
top: 0;
}
ul#primary-nav li ul li a { padding: 2px 5px; } /* Sub Menu Styles */
ul#primary-nav li:hover ul ul,
ul#primary-nav li:hover ul ul ul,
ul#primary-nav li.over ul ul,
ul#primary-nav li.over ul ul ul { display: none; } /* Hide sub-menus initially */
ul#primary-nav li:hover ul,
ul#primary-nav li li:hover ul,
ul#primary-nav li li li:hover ul,
ul#primary-nav li.over ul,
ul#primary-nav li li.over ul,
ul#primary-nav li li li.over ul { display: block; } /* The magic */
ul#primary-nav li.menuparent { background: transparent url(arrow.gif) right center no-repeat; }
ul#primary-nav li.menuparent:hover,
ul#primary-nav li.over { background-color: #A9CBA9; }
ul#primary-nav li a:hover { color: #000; }
</style>
</head>
<body>
<ul id="primary-nav">
<li><a href="#">Home</a></li>
<li class="menuparent"><a href="#">Culturas</a>
<ul>
<li class="menuparent"><a href="#">Soja</a>
<ul>
<li><a href="#">Adubação</a></li>
<li><a href="#">Custo de produção</a></li>
<li><a href="#">Deficiência nutricional</a></li>
<li><a href="#">Dessecação</a></li>
<li><a href="#">Doenças</a></li>
<li><a href="#">Histórico</a></li>
<li><a href="#">Inoculação</a></li>
<li><a href="#">Manejo da cultura</a></li>
<li><a href="#">Preços médios</a></li>
<li><a href="#">Soja Transgênica</a></li>
</ul>
</li>
<li class="menuparent"><a href="#">Milho</a>
<ul>
<li><a href="#">Adubação</a></li>
<li><a href="#">Custo de produção</a></li>
<li><a href="#">Deficiência nutricional</a></li>
<li><a href="#">Histórico</a></li>
<li><a href="#">Manejo da cultura</a></li>
<li><a href="#">Preços médios</a></li>
<li><a href="#">Silagem</a></li>
</ul>
</li>
<li class="menuparent"><a href="#">Trigo</a>
<ul>
<li><a href="#">Adubação</a></li>
<li><a href="#">Classificação</a></li>
<li><a href="#">Custo de produção</a></li>
<li><a href="#">Histórico</a></li>
<li><a href="#">Manejo da cultura</a></li>
<li><a href="#">Preços médios</a></li>
<li><a href="#">Principais pragas</a></li>
<li><a href="#">VNAC</a></li>
</ul>
</li>
<li><a href="#">Algodão</a></li>
<li><a href="#">Feijão</a></li>
<li><a href="#">Leite</a></li>
<li><a href="#">Ave</a></li>
<li><a href="#">Gado</a></li>
<li><a href="#">Suíno</a></li>
</ul>
</li>
<li class="menuparent"><a href="#">Serviços</a>
<ul>
<li class="menuparent"><a href="#">Adubos fertilizantes</a>
<ul>
<li><a href="#11">Ácidos</a></li>
<li><a href="#12">Cloretos</a></li>
<li><a href="#13">Nitratos</a></li>
<li><a href="#14">Sulfatos</a></li>
<li><a href="#15">Óxidos e Hidróxidos</a></li>
<li><a href="#16">Outros</a></li>
</ul>
</li>
<li class="menuparent"><a href="#">Venenos</a>
<ul>
<li><a href="#21">Inseticidas</a></li>
<li><a href="#22">Acaricidas</a></li>
<li><a href="#23">Herbicidas</a></li>
<li><a href="#24">Fungicidas</a></li>
</ul>
</li>
<li class="menuparent"><a href="#">Máquinas</a>
<ul>
<li><a href="#31">Arado</a></li>
<li><a href="#32">Grades</a></li>
<li><a href="#33">Cultivador</a></li>
<li><a href="#34">Plantadeiras</a></li>
<li><a href="#35">Semeadeires</a></li>
<li><a href="#35">Distribuidores</a></li>
</ul>
</li>
<li><a href="#41">Sementes</a></li>
</ul>
</li>
</ul>
</body>
</html>over = function() {
var sfEls = document.getElementById("nav").
getElementsByTagName("LI");
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=" over";
}
sfEls[i].onmouseout=function() {
this.className=this.className.
replace(new RegExp(" over\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", over);
Edição feita por: Rhariane, 22/11/2005, 12:15.
