让IE6支持li:hover的JS代码 ie6兼容性

转自： http://nihaojob.blog.163.com/blog/static/196324224201211572738/
最近在做一个网站时发现在IE6下下拉菜单竟然无法显示，于是上网查了相关资料。
原来IE6不支持除a标签以外的hover属性，我们了解hover属性是鼠标悬停效果。在IE7和FF中，对几乎任意元素都可以设置hover属性效果。而此属性效果的设置在IE6中，只对a标签有效，也就是说，IE6只能解释链接元素的悬停效果。其他元素的悬停效果IE6就不予理睬了。
没办法，只有加入JS了，也不知有其它办法没，正在关注中。
加入如下JS代码可解决问题，可对于不启动JS的浏览器那就麻烦了！
js:(document.getElementById("nav") 同时改为自己的Id)
<script language="javascript">
stuHover = function() {
var cssRule;
var newSelector;
for (var i = 0; i < document.styleSheets.length; i++)
for (var x = 0; x < document.styleSheets[i].rules.length ; x++)
{
cssRule = document.styleSheets[i].rules[x];
if (cssRule.selectorText.indexOf("LI:hover") != -1)
{
newSelector = cssRule.selectorText.replace(/LI:hover/gi, "LI.iehover");
document.styleSheets[i].addRule(newSelector , cssRule.style.cssText);
}
}
var getElm = document.getElementById("nav").getElementsByTagName("LI");
for (var i=0; i<getElm.length; i++) {
getElm[i].οnmοuseοver=function() {
this.className+=" iehover";
}
getElm[i].οnmοuseοut=function() {
this.className=this.className.replace(new RegExp(" iehover\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", stuHover);
</script>
id
<div id="nav">
<ul><li>让IE6支持LI:HOVER的JS代码</li></ul>
</div>
在做完以上工作后，却又出现了另外一个问题：
下拉菜单代码用了
<span><a>链接一</a><a>链接二</a></span>，在IE6下<a></a>，自动换行了，不是我要的IE7下的效果，看下css，原来我把span指定了width:auto;，而IE6下span 链接真发生了换行，如果要想不让它换行，需要为span指定一个宽度，于是加入了width:400px;成功解决问题。

转载于:https://www.cnblogs.com/qingtian-wjp/archive/2013/03/26/2982615.html