Maison > interface Web > tutoriel HTML > IE9中导航菜单位置跑偏(位置不准)问题_html/css_WEB-ITnose

IE9中导航菜单位置跑偏(位置不准)问题_html/css_WEB-ITnose

WBOY
Libérer: 2016-06-24 12:12:36
original
1359 Les gens l'ont consulté

css样式如下:
#menuspan ul { list-style: none; margin:0px; padding: 0px; }
#menuspan ul li { float:left; margin-left:2px;}
#menuspan ul li a { display:block; width:86px; height:28px; line-height:28px; text-align:center; background:url(/images/redimg/tabuncheck.jpg) 0 0 no-repeat; font-size:14px; color:white;}
#menuspan ul li a:hover { background:url(/images/redimg/tabchecked.jpg) 0 0 no-repeat;color:black;}
#menuspan ul li a#current { background:url(/images/redimg/tabchecked.jpg) 0 0 no-repeat; font-weight:bold; color:black;}
#menuspan ul li ul { border:0px; display:none;position:absolute;}
#menuspan ul li ul li {clear:both; width:86px; background:url(/images/redimg/tabuncheck.jpg) 0 0 no-repeat; margin:0px;}
#menuspan ul li ul li a {background:none;}
#menuspan ul li ul li a:hover { background:url(/images/redimg/tabchecked.jpg) 0 0 no-repeat; color:black;}
#menuspan ul li:hover ul {display:block;}
#menuspan ul li.sfhover ul {display:block;}
js代码如下:
function menuFix() {
var sfEls = document.getElementById("menuspan").getElementsByTagName("li");
for (var i=0; i sfEls[i].onmouseover=function() {
this.className+=(this.className.length>0? " ": "") + "sfhover";
}
sfEls[i].onMouseDown=function() {
this.className+=(this.className.length>0? " ": "") + "sfhover";
}
sfEls[i].onMouseUp=function() {
this.className+=(this.className.length>0? " ": "") + "sfhover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp("( ?|^)sfhover\\b"),"");
}
}
}
问题描述:
1.除了ie9,其他各种浏览器都能正常显示。
2.在ie9中,子菜单的位置经常向后错一个菜单模块。但是有时候又能正常显示。
3.我觉得是#menuspan ul li ul { border:0px; display:none;position:absolute;}的问题,但是也不知道如何修改。


回复讨论(解决方案)

ni 你设置ul li的margin:0;padding:0;试试

 你总的写点测试代码吧。。。就css和js。。怎么可能知道什么原因啊

上面这段,就是那个菜单代码,不好意思,代码缩进不是很好,因为是用jsp打印输出的源代码。

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal