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]-->