JavaScript小记

最新推荐文章于 2024-09-16 08:47:17 发布

weixin_30652897

最新推荐文章于 2024-09-16 08:47:17 发布

阅读量72

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/lema/archive/2011/02/28/1967114.html

版权

项目进行中需求变化，把所有的图片的呈现出渐出效果，我首先想到了filters：滤镜，

<html>

<head>
</head>
<script  language="JavaScript">
  function  picload(){
       img.filters.revealTrans.apply()
       img.filters.revealTrans.Transition=23
       img.style.visibility="inherit"
       img.filters.revealTrans.apply()

  
}
</script>


<Body οnlοad="picload">
<img src="jinxing.gif" id="img" style="visibility:hidden;FILTER:revealTrans(Duration=1,Transition=23);"/>
</Body>
</html>

运行下，成功了！

下面列出所有效果和对应Transition值（参考手册）：
值 : 效果
0 : 矩形收缩转换。
1 : 矩形扩张转换。
2 : 圆形收缩转换。
3 : 圆形扩张转换。
4 : 向上擦除。
5 : 向下擦除。
6 : 向右擦除。
7 : 向左擦除。
8 : 纵向百叶窗转换。
9 : 横向百叶窗转换。
10 : 国际象棋棋盘横向转换。
11 : 国际象棋棋盘纵向转换。
12 : 随机杂点干扰转换。
13 : 左右关门效果转换。
14 : 左右开门效果转换。
15 : 上下关门效果转换。
16 : 上下开门效果转换。
17 : 从右上角到左下角的锯齿边覆盖效果转换。
18 : 从右下角到左上角的锯齿边覆盖效果转换。
19 : 从左上角到右下角的锯齿边覆盖效果转换。
20 : 从左下角到右上角的锯齿边覆盖效果转换。
21 : 随机横线条转换。
22 : 随机竖线条转换。
23 : 随机使用上面可能的值转换。

其中23比较特别，是随机效果，程序默认就是随机效果。

apply,play方法为运行。

由此我们可以做出多张图片的切换效果

http://www.cnblogs.com/cloudgamer/archive/2008/05/23/1205642.html

这个讲的比较详细

客户的需求犹如沙漠的天气，光源扫描图，难受死了，哎

首先，我们怎样添加个光源呢，filters的方法addCone添加一个圆锥形式的光源。

其次，怎样改变光源的强烈及移动光源呢，用滤镜light（）来控制光源的强烈程度moveLight()来移动光源。

<STYLE>
.lightfilter{ filter:light();width:400}
</STYLE>
<SCRIPT language=JavaScript>
<!--
function lightinit(){
var ix2=myDiv.offsetWidth/2;
var iy2=myDiv.offsetHeight/2;
myDiv.filters[0].addCone(0,0,1,ix2,iy2,255,255,200,100,30)} //添加一个点光源
//-->
</script>
<DIV CLASS="lightfilter" ID="myDiv" οnmοusemοve="myDiv.filters[0].moveLight(0,window.event.x,window.event.y,5,1);">
<IMG src="111.jpg"></div>
<body onLoad="lightinit()">

好了，大家试试吧！

转载于:https://www.cnblogs.com/lema/archive/2011/02/28/1967114.html