IE5及其后续的版本支持css中的expression,expression 可以在css中调用Javascript 表达式. 最简单的应用,例如在设置高度为整个页面的高度:
例一 .
mainDiv {
height:expression(document.body.clientHeight)
left: expression(this.parentElement.offsetParent.scrollLeft);
}
上面的设置中,this 表示当前的元素对象.
例二:利用简单的表达式将屏幕高度控制到725
#container {
width: expression((documentElement.clientWidth > 725) ? "725px" : "auto" );
}
例三:有事件的表达式
<style type="text/css">
input {
star : expression(οnmοuseοver=function() {this.style.backgroundColor="#FF0000"}, οnmοuseοut=function(){this.style.backgroundColor="#FFFFFF"})
} </style>
例四:动态控制输入域的颜色
input{
background-color:expression((this.readOnly && this.readOnly==true)?"#f0f0f0":"")
}
总体来讲,expression的作用就是能够调用javascript的一些方法和参数来动态的给CSS的属性赋值,用起来是比较方便的,实现了CSS主动与javascript的互联,以往一直是在JS中通过this.style.XXX="" 来改变CSS的属性, Javascript占主动,想法是很不错的,可惜只有IE支持,firefox不支持,而且对浏览器的性能要求也比较高。所以大家要权衡使用。