1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2 <html xmlns="http://www.w3.org/1999/xhtml">
3 <head>
4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
5 <title>li:hover在IE6下兼容的方法</title>
6 <script language="javascript">
7 stuHover = function() {
8 var cssRule;
9 var newSelector;
10 for (var i = 0; i < document.styleSheets.length; i++)
11 for (var x = 0; x < document.styleSheets[i].rules.length ; x++)
12 {
13 cssRule = document.styleSheets[i].rules[x];
14 if (cssRule.selectorText.indexOf("LI:hover") != -1)
15 {
16 newSelector = cssRule.selectorText.replace(/LI:hover/gi, "LI.iehover");
17 document.styleSheets[i].addRule(newSelector , cssRule.style.cssText);
18 }
19 }
20 var getElm = document.getElementById("nav").getElementsByTagName("LI"); //ID号记得修改哦
21 for (var i=0; i<getElm.length; i++) {
22 getElm[i].onmouseover=function() {
23 this.className+=" iehover";
24 }
25 getElm[i].onmouseout=function() {
26 this.className=this.className.replace(new RegExp(" iehover\\b"), "");
27 }
28 }
29 }
30 if (window.attachEvent) window.attachEvent("onload", stuHover);
31 </script>
32 <style type="text/css">
33 li:hover { background:#00CC00; display:block; }
34 </style>
35 </head><body >
36 <div id="nav">
37 <ul><li>让IE6支持li:hover的方法</li></ul>
38 </div>
39 </body>
40 </html>
