龙盟编程博客 | 无障碍搜索 | 云盘搜索神器
快速搜索
主页 > web编程 > div+css/html >

css 给页面元素添加 a:hover 属性兼容ie,ff

时间:2012-12-29 08:41来源:未知 作者:admin 点击:
分享到:
FireFox 下,所有的页面元素都有 :hover 属性,当鼠标悬停时,可以变换样式,能给用户一个好的体验。但是 IE 下面,只有超级链接标签(A)才具备此属性,本文介绍的是通过 expression 设
FireFox 下,所有的页面元素都有 :hover 属性,当鼠标悬停时,可以变换样式,能给用户一个好的体验。但是 IE 下面,只有超级链接标签(A)才具备此属性,本文介绍的是通过 expression 设置,解决 IE 的这一问题

上面是效果,下面看实现代码

 代码如下

.whatever {

background: #808080;

padding: 20px;

}

.whatever:hover, .whateverhover {

background: #eaeaea;

}

</style>

 

<!-- Additional IE/Win specific style sheet (Conditional Comments) -->

<!--[if lte IE 6]>

<style type="text/css" media="projection, screen">

.whatever {

behavior: expression(

this.onmouseover = new Function("this.className += ' whateverhover';"),

this.onmouseout = new Function("this.className = this.className.replace(' whateverhover', '');"),

this.style.behavior = null

);

}

/*.whatever {

background-color: expression(

!this.js ? (this.js = 1,

this.onmouseover = new Function("this.className += ' whateverhover';"),

this.onmouseout = new Function("this.className = this.className.replace(' whateverhover', '');")

) : false);

);

}*/

/*.whatever {

background-color: expression(

this.onmouseover = new Function("this.className += ' whateverhover';"),

this.onmouseout = new Function("this.className = this.className.replace('whateverhover', '');")

);

}*/

</style>

<![endif]-->


精彩图集

赞助商链接