为所有的页面元素添加 :hover 属性

FireFox 下,所有的页面元素都有 :hover 属性,当鼠标悬停时,可以变换样式,能给用户一个好的体验。但是 IE 下面,只有超级链接标签(A)才具备此属性,本文介绍的是通过 expression 设置,解决 IE 的这一问题。

为所有的页面元素添加 :hover 属性 – 示例

<style type="text/css" media="projection, screen">
.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]-->

关于 Artlover

有多年 web 开发经验,擅长领域 PHP / MySQL / CSS / Javascript / Zend Framework ,期望:在分享中共同成长。
此条目发表在 CSS 分类目录,贴了 , , , , 标签。将固定链接加入收藏夹。

为所有的页面元素添加 :hover 属性》有 1 条评论

  1. kaka 说:

    呵呵,不错。
    但是,大量使用异常会导致ie的负荷过高,一切顺其自然吧。

发表评论

电子邮件地址不会被公开。 必填项已用 * 标注

*


*

您可以使用这些 HTML 标签和属性: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>