日历
选择模板
6 Mar.2007

用CSS控制输入框input样式,鼠标悬停交互效果(仅IE有效)

作者: yeyo   分类:网络生活   出处:本站原创       | |
直接在CSS文件中控制输入框input样式,鼠标悬停交互效果(仅IE有效)。不但实现了内容与表现分离,而且使xhtml代码减小,促进了代码重用、更加的优化。演示见本站输入表单(如评论、注册、登入表单)。
  这一方法的原理,主要是应用CSS的expression,IE5及其以后版本支持在CSS中使用expression,用来把CSS属性和Javascript脚本关联起来,这里的CSS属性可以是元素固有的属性,也可以是自定义属性。就是说CSS属性后面可以是一段Javascript表达式,CSS属性的值等于Javascript表达式计算的结果。 在表达式中可以直接引用元素自身的属性和方法,也可以使用其他浏览器对象。这个表达式就好像是在这个元素的一个成员函数中一样。说简单点就是:我们可以通过expression把Javascript脚本写放在css文件中,通过它来实现一些很方便的功能与效果。
我们看下面的CSS代码:
input {star : expression(
onmouseover=function(){this.style.borderColor="#FF9900"},
onmouseout=function(){this.style.borderColor="#666666"})}

需要引起你特别重视的:若不是非常特别的需要用到expression,一般不建议使用expression,因为expression非常占用服务器的CPU资源。
时间:11:38 评论(5) 引用(0) 阅读(12448) Tags: , , ,
westant
2008.12.18 13:05
input:hover就可以了
10
2008.01.21 10:58
input {star : expression(
onmouseover=function(){this.style.borderColor="#FF9900"},
onmouseout=function(){this.style.borderColor="#666666"})}
gsxswx
2007.06.24 11:34
最近正需要这个,谢了。
phpwind Email Homepage
2007.03.19 18:26
stupid非常需要 但看不懂  -  -!!!
lee Homepage
2007.03.08 14:02
shyJS,有时间要好好学
simear2004 回复于 2007.03.08 21:47
shy
分页: 1/1 第一页 1 最后页
发表评论
  昵称 [注册]
  密码 (游客无需密码)
  网址
  电邮
OpenID登入 权限选项 表情