hover伪类的使用

大伟 发布于2008-05-23 16:59:58 | 185次阅读 | 字体: 打印预览


前段时间在论坛上有人问到一个淘宝网上的hover伪类实现的效果如果兼容ie6。
帖子:http://bbs.blueidea.com/thread-2854899-1-1.html
淘宝效果预览:http://list.mall.taobao.com/1343/g-s-----40-0--1343.htm

其实,问题很简单,就是hover伪类在IE6中得不到很好的支持,因为IE6只支持css1,而在css1中hover伪类只能针对a标签来起作用,看了一下淘宝的代码,他们的解决方法是:
首先,按照ie7/FF都支持的css2的写法来写。其次针对IE6不支持css2再做特殊处理。也就是通过javascript来弥补ie6下的不足。

这段javascript的原理是这样的:
photo 程序代码
根据某些特征找到需要添加hover效果的标签
对此标签添加onmouseover和onmouseout事件
在onmouseover事件中给对象赋予新的css class属性,同样,在onmouseout时移除该css class即可模拟成hover伪类的效果了。

这里有一个简单的示例,供大家参考!

本文出处 : http://www.iwcn.net/article.asp?id=72 end

上一篇:test

下一篇:抽奖纪念

现在评论本文

authnum

0 条评论