JS解决IE 6不支持:hover伪类的简单方法 » 豆豆猫的窝

JS解决IE 6不支持:hover伪类的简单方法

2009年3月16日

css2中规定，:hover伪类可以应用在全部元素上，而ie6只支持<a>的伪类，因此对于ie6需要使用js，而ie7/ff/op/sa直接定义:hover即可。

程序来源于网络，非猫创

—-点此查看JavaScript文件—-

下面的代码是html代码，插入到head区内:

<!--[if lte IE 6]>
<script type="text/javascript" language="Javascript" src="hover.js"></script>
<![endif]-->

因为IE 7+支持:hover，因此使用条件注释，只针对IE 6-调用该JS文件。

相应的CSS为：

/* 这个是普通样式，定义给需要效果的元素 */
.hovereffect {
border:1px solid blue;
}
/* 这个是hover样式 */
.hovereffect:hover,
.lay-on {
background: #eee;
border:1px solid red;
}

应用：

<div class="hovereffect">div的hover</div>
<p class="hovereffect">p的hover</p>

标签：:hover，IE6，JavaScript
分类：Web前端技术 and 布局+特效 and 杂文

《JS解决IE 6不支持:hover伪类的简单方法》有 7 条评论

wudan118说道：

2009年3月24日10:50

猫猫,在FF里没用啊,这个

回复
豆猫说道：

2009年3月24日12:42

ie7/ff/op/sa直接定义:hover即可

回复
lu说道：

2010年1月11日15:39

当某元素本身有底色时，在ie6下这个方法依然不管用。。。

猫回复：请举个例子。

回复
任羽飞说道：

2010年3月20日22:00

据说这个问题直接在下面添加一个a:hover{xx:yy;}等任意值就可以恢复正常

回复
shtml说道：

2010年8月10日09:29

在ie6下依然无效

回复
yunsi说道：

2011年4月7日17:43

依然无效,鉴定完毕

回复
qiujiao说道：

2011年4月7日17:44

求教，有没有其它的好的方法啊？

回复

向lu进行回复取消回复