╋艺 镇╋╋网站网络|程序语言|Flash╋┣◇网站建设&Web语言 → css expression求解


  共有20202人关注过本帖树形打印复制链接

主题:css expression求解

美女呀,离线,留言给我吧!
admin
  1楼 | 信息 | 搜索 | 邮箱 | 主页 | UC


加好友 发短信 司令 亲民勋章
等级:管理员 帖子:3027 积分:27521 威望:0 精华:7 注册:2003/12/30 16:34:32
css expression求解  发帖心情 Post By:2012/3/5 14:07:46 [只看该作者]

width:expression(this.width 480 this.width ? 480: true); height:expression(this.height 640 this.height ? 640: true); max-height: 640px; max-width:480px;

这段代码在IE6中完全不发挥作用,但其他浏览器都可以。有哪位能指点啊?谢谢。在线等。

------------------

expression 可以将CSS和javascript表达式关联起来,这里的CSS属性可以是本身固有的,比如说你可以用body{width:expression(screen.availWidth+"px";}来设置页面宽度为屏幕可用宽度;也可以是自定义的属性,比如body{any:expression(onload=function(){xxx;xxx;xxx;},onunload=function(){xxx;xxx;xxx;xxx;);}为你定义了一种新的CSS属性any,该属性为BODY的onload和onunload定义了两个执行函数。

expression是css中的一个行为,IE5及其以后版本支持在CSS中使用expression,用来把CSS属性和Javascript表达式关联起来,这里的CSS属性可以是元素固有的属性,也可以是自定义属性。就是说CSS属性后面可以是一段Javascript表达式,CSS属性的值等于Javascript表达式计算的结果。 在表达式中可以直接引用元素自身的属性和方法,也可以使用其他浏览器对象。这个表达式就好像是在这个元素的一个成员函数中一样。

CSS Expression也称为CSS表达式,它是动态设置CSS属性的强大方法,但也存在着一定的危险性。

在CSS Expression中使用JavaScript表达式。CSS属性根据JavaScript表达式的计算结果来设置。

CSS Expression在其它浏览器中不起作用,因此在跨浏览器的编码中单独针对IE设置时会比较有用。

从IE5开始支持CSS Expression。我们看下面的代码:

background-color: expression((new Date()).getHours()%2 ? "#F00" : "#00F" );

上面的代码是使用CSS Expression,实现隔一个小时切换一次背景颜色。

CSS Expression的问题就在于它的计算频率要比想象的多出很多。不仅仅是在页面显示和缩放时,就是在页面滚动、乃至移动鼠标时都会要重新计算一次。给CSS Expression增加一个计数器可以跟踪表达式的计算频率。在页面中随便移动鼠标都可以轻松达到10000次以上的计算量。

一个减少CSS Expression计算次数的方法就是使用一次性的表达式,它在第一次运行时将结果赋给指定的样式属性,并用这个属性来代替CSS Expression。

如果样式属性必须在页面周期内动态地改变,使用事件句柄来代替CSS表达式是一个可行办法。如果必须使用CSS Expression,一定要记住它们要计算成千上万次并且可能会对你页面的性能产生影响。不要让您的用户感觉打开你的页面,机器会变的很慢。


  
“艺镇”官方站:www.zyzsky.com QQ群:1221854  回到顶部
美女呀,离线,留言给我吧!
admin
  2楼 | 信息 | 搜索 | 邮箱 | 主页 | UC


加好友 发短信 司令 亲民勋章
等级:管理员 帖子:3027 积分:27521 威望:0 精华:7 注册:2003/12/30 16:34:32
  发帖心情 Post By:2012/3/5 14:07:58 [只看该作者]

其实,你的expression从没有起作用,在其他浏览器有效果实际上是你后面的max-height之类的在起作用.

我写了一个示例,发现当未定义元素的width和height,它们都是无值的,是undefined.所以,相应expression语句应该这么写:

width:expression((this.offsetWidth > 490) ? (this.width = 490 +'px') : true);

有offsetWidth代替width....此句意思是当元素宽度超过490时,将其宽限为490....

剩下的不用我说了吧? 


  
平面设计、网站建设、三维动画、视频制作 联系QQ:114103945  回到顶部