CSS expression属性
expression属性是在IE5版本之后支持使用的，用来把CSS属性和JavaScript脚本关联起来。简单粗暴的说，该属性是用来调用JavaScript代码的。
CSS属性后面是一段JavaScript代码，CSS的值是JavaScript表达式计算的结果。
给元素固有属性赋值
.box1{
position: absolute;
top: expression(eval(document.documentElement.scrollTop+80)); /* 这里需要获取滚动高度+元素原本的高度 */
z-index: 999;
}
document.documentElement.scrollTop 的意思是获取当前页面滚动条所滚动到的位置的数值，而再用eval()函数把它计算成数值。
这句代码最终的意思就是：你浏览器窗口的滚动条滑到哪，这个元素的位置就在哪。
给元素自定义属性赋值
用CSS自定义属性Expression对表格行间隔背景批量定义
<html>
<head>
<title></title>
<style type="text/css">
tr{ bg:expression('#F8F8F8,#EFEFEF'.split(',')[rowIndex%2]); }
</style>
</head>
<body>
<table width="100%" border="0">
<tr>
<td> </td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td> </td>
</tr>
</table>
</body>
</html>
上面的代码可以实现表格行背景色（#F8F8F8,#EFEFEF）交替出现，不需要每行单独定义。
bg是自己任意定义的属性。在自定义属性与expression之间可别忘了还有一个引号，因为实质还是CSS，所以放在style标签内，而非script内。
注意
不是非常需要，一般不建议使用expression，因为expression对浏览器资源要求比较高
CSS expression的问题就在于它的计算频率要比想象的多出很多。不仅仅是在页面显示和缩放时，就是在页面滚动、乃至移动鼠标时都会要重新计算一次。给CSS expression增加一个计数器可以跟踪表达式的计算频率。在页面中随便移动鼠标都可以轻松达到10000次以上的计算量。
性能优化
一个减少CSS expression计算次数的方法就是使用一次性的表达式，它在第一次运行时将结果赋给指定的样式属性，并用这个属性来代替CSS expression。
CSS expression属性存在很多问题，最好的优化就是不使用该属性。
CSS expression属性的更多相关文章
- css expression
概述 css expression(css表达式)又称Dynamic properties(动态属性)是早期微软DHTML的产物,以其可以在Css中定义表达式(公式)来达到建立元素间属性之间的联系等作 ...
- 实现最小宽度的几种方法及CSS Expression[转]
实现最小宽度的几种方法及CSS Expression[转] 实现最小宽度的几种方法:css表达式尽量不用 支持FF IE7 IE6 .test { background:blue; min-widt ...
- IE6支持兼容min-width、max-width CSS样式属性
IE6支持兼容min-width.max-width CSS样式属性 让IE6支持max-width.IE6支持min-width样式 我们在写CSS的时候,常常会遇到让一个图片或一个布局不能超出设定 ...
- CSS will-change 属性
介绍 如果你注意到在webkit的浏览器上“flicker”一些CSS操作(尤其是变形和动画方面的)的表现,你很可能之前就注意过硬件加速了 CPU.GPU和硬件加速 硬件加速意味着Graphics P ...
- css动画属性性能
性能主要表现:流量.功耗与流畅度 在现有的前端动画体系中,通常有两种模式:JS动画与CSS3动画. JS动画是通过JS动态改写样式实现动画能力的一种方案,在PC端兼容低端浏览器中不失为一种推荐方案. ...
- CSS字体属性大全
文章转自:http://www.10wy.net/Article/CSS/CSS_list_8.html查看更多更专业性的文章请到:网页设计网 CSS字体属性 字体名称属性(font-family) ...
- css z-index属性使用过程中遇到的问题
z-index属性在web开发中会经常使用,其主要的作用简单的说就是把元素的position设置为absolute.fixed之后,可以调节元素在文档上的层级关系.比如经常见到的dialog,mask ...
- 【转】CSS z-index 属性的使用方法和层级树的概念
文章转自:CSS z-index 属性的使用方法和层级树的概念,另外加了一点自己的注释 CSS 中的 z-index 属性用于设置节点的堆叠顺序, 拥有更高堆叠顺序的节点将显示在堆叠顺序较低的节点前面 ...
- css之属性部分
这篇写的是今天的学习到的属性,一共20个. 属性再多,但也要会使用,会在使用时可以记起它,才能起到它为我们所需要的作用. 样式属性 1.border CSS边框属性允许你指定一个元素边框的样式和颜色. ...
随机推荐
- SQLServer 查看耗时较多的SQL语句(转)
total_worker_time AS [总消耗CPU 时间(ms)],execution_count [运行次数], qs.total_worker_time AS [平均消耗CPU 时间(ms) ...
- Swift 里的指针
 基础知识 指针的内存状态 typed? initiated? ❌ ❌ ✅ ❌ ✅ ✅ 之前分配的内存可能被释放,使得指针指向了未被分配的内存. 有两种方式可以使得指针指向的内存处于Uninitia ...
- .NET手记-为ASP.NET MVC程序集成Autofac
MVC Autofac总是会紧跟最新版本的ASP.NET MVC框架,所以文档也会一直保持更新.一般来讲,不同版本的框架集成Autofac的方法一般不变. MVC集成需要引用 Autofac.Mvc5 ...
- postgresql-删除重复数据
greenplum最终的方法是: delete from test where (gp_segment_id, ctid) not in (select gp_segment_id, min(ct ...
- eclipse在linux安装报错
JVM terminated. Exit code=127/usr/bin/java-Dosgi.requiredJavaVersion=1.8-Dosgi.instance.area.default ...
- 比较List和ArrayList的性能及ArrayList和LinkedList优缺点
List和ArrayList的性能比较 在使用ArrayList这样的非泛型集合的过程中,要进行装箱和拆箱操作,会有比较大的性能损失,而使用泛型集合就没有这样的问题.List是泛型,而ArrayLis ...
- centos7 部署YApi
=============================================== 2018/6/5_第2次修改 ccb_warlock 更新说 ...
- Java SE 9（JDK9）环境安装及交互式编程环境Jshell使用示例
目的 安装JDK 9, 练习Jshell工具的使用, 体验Java的交互式编程环境. 什么是Jshell 其实就是一个命令行工具,安装完JDK9后,可以在bin目录下找到该工具,与Python的解释器 ...
- Jenkins 批量删除历史构建
在一次巡查 Jenkins 时,发现很多个项目的历史构建比较多,这些历史构建对于现在来说又没有什么用处,那么想把它删除,但是一个一个删除很累,毕竟总共加起来有上千个,历史构建,而且还不只是一个项目.那 ...
- 【杂谈】线程中断——Interrupt
前言 以前有一个错误的认识,以为中断操作都会抛出异常,后来才发现并不是这样,所以今天就来做一个关于中断的总结. 如何关闭线程 已被弃用的Stop方法 早期,Thread类中有一个stop方法,用于强行 ...