Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
tenho esse script :
<style>
.menu {
background-color: #333;
position: relative;
width: 890px;
height: 20px;
margin: 0px;
padding: 0px;
left: 35px;
top: 13px;
Float:left;
z-index:2; }
/ link e link visitado /
#menu a:link,a:visited {
display: block;
width: inherit;
font-weight: bold;
color: #fff;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 16px;
padding-right: 15px;
font-size: 10px;
text-align: center;
text-decoration: none;
text-transform: uppercase;
}
/* width:120px;*/
/* area do menu */ text-align: center;
margin: 0;
width: 100% ;
padding: 0;
list-style-type: none;
overflow: hidden;
border: 0;
}
/ posição de cada um dos botões /
#menu ul li {
position: relative;
display: block;
float: left;
text-align: center;
padding: 0;
margin: 0;
}
*#menu ul li {
float: left;
height: 1%;
}
/* cada um dos botões */
#menu ul li a {
background: #fff;
width: 78px;
height: 18px;
display: block;
border-top: 1px solid #f5d7b4;
text-decoration: none;
color: #f5d7b4;
padding: 0;
margin: 0 0 10px 0;text-decoration: none;
text-align: center;
border: 0px solid #000;
border-left: 1px solid #f5d7b4;
border-bottom: 1px solid #f5d7b4;
border-right: none;
font: normal 10px/18px "Lucida Grande", "Lucida Sans Unicode", verdana, lucida, sans-serif;
} height: 20%;
}
/* cada um dos submenus */ position: relative;
left: 0px;
top: 0px;
display: none;
} float: left;
* width: 18px;
} background-color: #7A991A;
}
#menu a:active {
background: #c60;
color: #fff;
} background: #c60;
border: 1px solid #c60;
color: #fff; } display: block;
position: relative;
margin: 0px;
padding: 0px;
} float: none;
} display: none;
}
#menu li li:hover ul{
display: block;
}
#menu li:hover li a {
background-color: #ddd;
border-bottom: 1px solid #fff;
color: #000;
}
#menu ul li a:hover {
color: #930;
background: #f5d7b4;
}
#menu li li a:hover {
background-color: #8db3ff;
}
</style>
e este menu em html
<body>
<ul id="menu">
<li><a href="#">A</a></li>
<li><a href="#">B</a>
<ul>
<li><a href="#">Ba</a></li>
<li><a href="#">Bb</a></li>
<li><a href="#">Bc</a></li>
<li><a href="#">Bd</a></li>
<li><a href="#">Be</a></li>
<li><a href="#">Bf</a></li>
<li><a href="#">Bh</a></li>
<li><a href="#">Bi</a></li>
<li><a href="#">Bj</a></li>
<li><a href="#">Bk</a></li>
</ul>
</li>
<li><a href="#">C</a></li>
<li><a href="#">D</a></li>
<li><a href="#">E</a></li>
<li><a href="#">F</a></li>
<li><a href="#">G</a></li>
<li><a href="#">H</a></li>
<li><a href="#">I</a></li>
<li><a href="#">J</a></li>
</ul>
</body>
// JavaScript Document
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);
e este :
// JavaScript Document
var mmOpenContainer = null;
var mmOpenMenus = null;
var mmHideMenuTimer = null;
function MM_menuStartTimeout(hideTimeout) {
mmHideMenuTimer = setTimeout("MM_menuHideMenus()", hideTimeout);
}
function MM_menuHideMenus() {
MM_menuResetTimeout();
if(mmOpenContainer) {
var c = document.getElementById(mmOpenContainer);
c.style.visibility = "inherit";
mmOpenContainer = null;
}
if( mmOpenMenus ) {
for(var i = 0; i < mmOpenMenus.length ; i++) {
var m = document.getElementById(mmOpenMenus[i]);
m.style.visibility = "hidden";
}
mmOpenMenus = null;
}
}
function MM_menuHideSubmenus(menuName) {
if( mmOpenMenus ) {
var h = false;
var c = 0;
for(var i = 0; i < mmOpenMenus.length ; i++) {
if( h ) {
var m = document.getElementById(mmOpenMenus[i]);
m.style.visibility = "hidden";
} else if( mmOpenMenus[i] == menuName ) {
h = true;
} else {
c++;
}
}
mmOpenMenus.length = c+1;
}
}
function MM_menuOverMenuItem(menuName, subMenuSuffix) {
MM_menuResetTimeout();
MM_menuHideSubmenus(menuName);
if( subMenuSuffix ) {
var subMenuName = "" + menuName + "_" + subMenuSuffix;
MM_menuShowSubMenu(subMenuName);
}
}
function MM_menuShowSubMenu(subMenuName) {
MM_menuResetTimeout();
var e = document.getElementById(subMenuName);
e.style.visibility = "inherit";
if( !mmOpenMenus ) {
mmOpenMenus = new Array;
}
mmOpenMenus[mmOpenMenus.length] = "" + subMenuName;
}
function MM_menuResetTimeout() {
if (mmHideMenuTimer) clearTimeout(mmHideMenuTimer);
mmHideMenuTimer = null;
}
function MM_menuShowMenu(containName, menuName, xOffset, yOffset, triggerName) {
MM_menuHideMenus();
MM_menuResetTimeout();
MM_menuShowMenuContainer(containName, xOffset, yOffset, triggerName);
MM_menuShowSubMenu(menuName);
}
function MM_menuShowMenuContainer(containName, x, y, triggerName) {
var c = document.getElementById(containName);
var s = c.style;
s.visibility = "inherit";
mmOpenContainer = "" + containName;
}
Porem o menu abre bem em todos os navegadores menos no IE, no IE ele fica espremido no canto esquerdo e nos demais fica certo com a largura correta
alguém vendo os códigos pode me mostrar onde eu errei
Carregando comentários...