浏览 5197 次
|
锁定老帖子 主题：IE 6 中的hover问题
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
|
|
|---|---|
| 作者 | 正文 |
|
发表时间：2008-03-17
在IE 6中，只有<a></a>可以使用hover。
然而在IE 7和ff中，其他的element也可以使用hover。 不过，目前的客户他们还都徘徊在IE 6中呢。 怎么样解决IE 6中其他element的hover问题呢？ 例如，一个div,一个table row 或者一个table gird。 不知道大家在这方面有没有什么经验可以传授。 声明：ITeye文章版权属于作者，受法律保护。没有作者书面许可不得转载。
推荐链接
|
| 返回顶楼 | |
|
发表时间：2008-03-17
通常是用 mouseover 模拟处理，有些 js 框架自动解决了这些问题，你可以 google IE7 js
|
| 返回顶楼 | |
|
发表时间：2008-03-17
catoc 写道 通常是用 mouseover 模拟处理，有些 js 框架自动解决了这些问题，你可以 google IE7 js
网上发现了这个http://blog.pr1984.com/article.asp?id=65 就是用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="PRcss的个人主页,无聊的,神经的,懒惰的..." />
<meta name="Author" content="PRcss,qq:50198763" />
<meta name="Copyright" content="本页版权归PRcss所有。All Rights Reserved" />
<link rel="shortcut icon" href="http://www.pr1984.com/favicon.ico" />
<title>IE6:hover - www.pr1984.com</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;
<!-- // 获取单个对象
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");
}
// 让所有标记支持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){
//$();
}
//-->
</script>
</body>
</html>
|
| 返回顶楼 | |
|
发表时间：2008-03-17
上面的代码大意是正确的，但是太粗糙了。我以前写过一个，不过现在一时找不到了。
|
| 返回顶楼 | |
|
发表时间：2008-03-18
是不是利用css selector来取得元素 然后注册over out事件更好呢
如果用jquery来实现 代码应该清爽很多吧 |
| 返回顶楼 | |
|
发表时间：2008-03-18
hax 写道 上面的代码大意是正确的，但是太粗糙了。我以前写过一个，不过现在一时找不到了。
上面的代码只是个例子而已。实际应用时的代码并没有这么多。 不知道你还能不能找到你自己写的那份，让大家分享一下。 |
| 返回顶楼 | |
