原创 让IE6也支持hover[JS模拟]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="zh-CN" xml:lang="zh-CN">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="hover,PRcss,xhtml,html,css,js" />
<meta name="description" content="" />
<meta name="Author" content="" />
<meta name="Copyright" content="" />
<link rel="shortcut icon" href="" />
<title></title>
<style type="text/css" media="screen"><!--
body { background:#fff; }
table { border:solid 1px #ccc; color:#ccc; }
table:hover,table.hover { border-color:#900; color:#333; }
ul li:hover,ul li.hover { background:#eee; }
--></style>
</head>
<body>
<table id="pr_table">
<tr><td>测试</td></tr>
</table>
<ul id="pr_nav">
<li>测试</li>
</ul>
<script type="text/javascript">
// 浏览器版本判断
var Client = {
Engine: {'name': 'unknown', 'version': ''},
Features: {}
};
Client.Features.xhr = !!(window.XMLHttpRequest);
Client.Features.xpath = !!(document.evaluate);
if (window.opera) Client.Engine.name = 'opera';
else if (window.ActiveXObject) Client.Engine = {'name': 'ie', 'version': (Client.Features.xhr) ? 7 : 6};
else if (!navigator.taintEnabled) Client.Engine = {'name': 'webkit', 'version': (Client.Features.xpath) ? 420 : 419};
else if (document.getBoxObjectFor != null) Client.Engine.name = 'gecko';
Client.Engine[Client.Engine.name] = Client.Engine[Client.Engine.name + Client.Engine.version] = true;
// 让所有标记支持hover
function $(){
var obj=document.all;
for(var i=0;i<obj.length;i++){
obj[i].onmouseover=function(){
this.tmpClass=this.className;
this.className+=" hover";
}
obj[i].onmouseout=function(){
this.className=this.tmpClass;
}
}
}
if(Client.Engine.ie6){$();}
// 获取单个对象
function $1(e){
var pr=document.getElementById(e);
pr.onmouseover=function(){
this.tmpClass=this.className;
this.className+=" hover";
}
pr.onmouseout=function(){
this.className=this.tmpClass;
}
}
if(Client.Engine.ie6){ $1("pr_table");}
// 获取多个子对象
function $2(e){
var pr=document.getElementById(e).getElementsByTagName("li");
for(var i=0;i<pr.length;i++){
pr[i].onmouseover=function(){
this.tmpClass=this.className;
this.className+=" hover";
}
pr[i].onmouseout=function(){
this.className=this.tmpClass;
}
}
}
if(Client.Engine.ie6){ $2("pr_nav"); }
</script>
</body>
</html>
浙公网安备 33010602011771号