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边框属性允许你指定一个元素边框的样式和颜色. ...
随机推荐
- weblogic安装及配置
WebLogic是用于开发.集成.部署和管理大型分布式Web应用.网络应用和数据库应用的Java应用服务器. 1.安装Weblogic:(1)点击Next按钮:(2) 选择Custom后点击Next按 ...
- [CocoaPods]使用CocoaPods进行测试
测试规格 从CocoaPods 1.3.0开始,pod现在可以提供测试规范(或简称测试规范).测试规范可用于描述给定pod的测试源. 这是一个示例CoconutLib.podspec,一个定义测试规范 ...
- MySQL-Cluster 和主从(Master,Slave)搭建总结
双主互备,主从 什么是双主 MultiSource 多源复制 原理及流程图 主要步骤 1,在 Master Server 上开启 bin log 日志 和 设置 server-id :(在my.cn ...
- MySQL 字符集utf8和utf-8的关系
目录 什么是字符集(character set) 校对规则(collation) ASCII码 Unicode国际化支持 UTF-8 utf8 utf8与utf8mb4的关系 超集 字符集设置 什么是 ...
- Info - 信息获取途径汇总
目的驱动 大多数情况下,都是为了解决某个问题或完成某项任务,才需要进行针对性的.大范围的.细致化的信息获取. 那么,信息获取的方式和来源,就应该紧紧围绕这个"问题和任务"本身来确定 ...
- mac的safari浏览器调试ios手机网页
iOS 6给Safari带来了远程的Web检查器工具. 一.参考链接 ios开发者文档 safari开发者工具 remote debugging safari 二.设置iphone 设置 -> ...
- [EXP]Joomla! Component Easy Shop 1.2.3 - Local File Inclusion
# Exploit Title: Joomla! Component Easy Shop - Local File Inclusion # Dork: N/A # Date: -- # Exploit ...
- python之排序算法
排序是每个语言都需要学会的,不管是c++.java还是python,套路都是类似的 python中也有自带的排序函数sort,直接使用也可 闲来无事写了几个排序算法,各不相同 1.每次遇到最小的数都交 ...
- localStorage的存储、获取、删除操作
var store={ // 保存 save:function(key,value){ localStorage.setItem(key,JSON.stringify(value)); }, // 获 ...
- 【Java基本功】一文读懂final关键字的用法
本文主要介绍了final关键字的基本使用方法及原理 final关键字可以修饰类.方法和引用. 修饰类,该类不能被继承.并且这个类的对象在堆中分配内存后地址不可变. 修饰方法,方法不能被子类重写. 修饰 ...