您的位置:首页 > 其它

使ie6 支持:hover等伪类

2009-03-30 15:52 225 查看
由于万恶的ie6 ,对 伪类:hover 等伪类支持的欠缺。 所有需要用js+css 来弥补这个缺陷,让你的页面能兼容IE6 正常显示。

原理:针对ie6,改变目标className为 className_hover。 当然,在css样式中要有对应的样式。

css 中这样写 className:hover, className_hover{....................}

//*****************************************************
// s使ie6 支持:hover 浏览器版本判断
// 作用:让所有标记支持hover
// 原理:鼠标经过,和移开,更改标签样式
// 需要在CSS文件中
//	如:e:hover ,e_hover{.......}
//	e_hover是js 给标签添加的样式
//*****************************************************
// 浏览器版本判断
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;
}
}
}

//e对象下的所有tag支持:hover
//推荐这种方法

function $2(e, tag){
var pr=document.getElementById(e).getElementsByTagName(tag);
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;
}
}
}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: