filters.revealTrans.Transition使用方法小结


Posted in Javascript onAugust 19, 2010

下面首先来看下RevealTrans的用法(可以同时打开当鼠标移动到链接,类似幻灯片效果出现提示,移开也一样这个页巩固下).

语法:
filter : progid:DXImageTransform.Microsoft.RevealTrans ( enabled=bEnabled , duration=fDuration , transition=iTransitionType )
示范:参考文章:
属性:
enabled : 可选项。布尔值(Boolean)。设置或检索滤镜是否激活。true | false true : 默认值。滤镜激活。
false : 滤镜被禁止。

duration : 可选项。浮点数(Real)。设置或检索转换完成所用的时间。其值为秒.毫秒(0.0000)格式。
你可以使用 play 方法的 iDuration 参数设置转换回放的持续时间。然而,当你一旦调用了 play 方法,在回放持续过程中 Duration 特性就变为只读特性。
transition : 可选项。整数值(Integer)。设置或检索转换所使用的方式。 0 : 矩形收缩转换。
1 : 矩形扩张转换。
2 : 圆形收缩转换。
3 : 圆形扩张转换。
4 : 向上擦除。
5 : 向下擦除。
6 : 向右擦除。
7 : 向左擦除。
8 : 纵向百叶窗转换。
9 : 横向百叶窗转换。
10 : 国际象棋棋盘横向转换。
11 : 国际象棋棋盘纵向转换。
12 : 随机杂点干扰转换。
13 : 左右关门效果转换。
14 : 左右开门效果转换。
15 : 上下关门效果转换。
16 : 上下开门效果转换。
17 : 从右上角到左下角的锯齿边覆盖效果转换。
18 : 从右下角到左上角的锯齿边覆盖效果转换。
19 : 从左上角到右下角的锯齿边覆盖效果转换。
20 : 从左下角到右上角的锯齿边覆盖效果转换。
21 : 随机横线条转换。
22 : 随机竖线条转换。
23 : 随机使用上面可能的值转换。

特性:
Enabled : 可读写。布尔值(Boolean)。参阅 enabled 属性。
Duration : 可读写。浮点数(Real)。参阅 duration 属性。
Transition : 可读写。整数值(Integer)。参阅 transition 属性。
Percent : 可读写。字符串(String)。设置或检索当前静态滤镜输出在转换进程中所处的点。取值范围为 0 - 100 。默认值为 0 ,转换尚未开始。 100 为转换完成。
此特性可用于使用转换滤镜建立静态滤镜效果。设置其值等于定义了转换进程停止的点。使用转换滤镜建立静态滤镜效果可遵循以下步骤:
使用转换滤镜的 apply 方法。这将捕获对象内容的初始显示,设置 Percent 特性值为 0 。
改变对象内容。如 visibility , innerText , background-color , border ,或者其子对象的属性。
设置转换滤镜的 Percent 特性。即确定你希望的转换进程中某一点。这将捕获到转换进程中在该点处的一张内容图像。
设置转换滤镜的 Enabled 特性值为 true 。则滤镜作用的对象将依据获取到的图像更新其内容。
请注意:你只能使用 visibility 属性来改变对象的子对象。否则,对子对象的直接改变会被立即显示出来,而不会被转换滤镜捕获。
status : 只读。整数值(Integer)。检索转换的当前状态。0 | 1 | 2 0 : 转换停止(stop)。
1 : 转换被应用(apply)。
2 : 转换在进行(play)。

方法:
apply : 捕获对象内容的初始显示,为转换做必要的准备。无返回值。
当此方法一旦被调用后,对象属性的任何改变都不会被显示,直到你调用 play 方法开始转换。
请注意:你只能使用 visibility 属性来改变对象的子对象。否则,对子对象的直接改变会被立即显示出来,而不会被转换滤镜捕获。
当你调用 play 方法时,转换呈现出内容的变化结果(对象的属性和子对象的 visibility 属性的改变)。
play ( iDuration ) : 开始转换。无返回值。参数见下表。
iDuration : 可选项。浮点数(Real)。 指定滤镜作用持续的时间。默认单位为秒。
使用 play 方法的 iDuration 参数设置转换回放的持续时间,其值在转换的当前一个周期内会替换 Duration 属性的设置。但是下一次转换会恢复使用 Duration 属性设置的值。

stop : 停止转换回放。并呈现转换结果图像。同时激发 onfilterchange 事件。无返回值。

Javascript 相关文章推荐
document.body.scrollTop 值总为0的解决方法 比较常见的标准问题
Nov 30 Javascript
拖动table标题实现改变td的大小(css+js代码)
Apr 16 Javascript
利用jQuery简单实现产品展示图片左右滚动功能(示例代码)
Jan 02 Javascript
jquery带翻页动画的电子杂志代码分享
Aug 21 Javascript
JQuery入门基础小实例(1)
Sep 17 Javascript
JS实现单击输入框弹出选择框效果完整实例
Dec 14 Javascript
js ajaxfileupload.js上传报错的解决方法
May 05 Javascript
JS中如何实现点击a标签返回页面顶部的问题
Jan 19 Javascript
Vue.js实现列表清单的操作方法
Nov 15 Javascript
微信小程序实现图片压缩功能
Jan 26 Javascript
详解Vue.js自定义tipOnce指令用法实例
Dec 19 Javascript
vuex 动态注册方法 registerModule的实现
Jul 03 Javascript
JS面向对象编程之对象使用分析
Aug 19 #Javascript
JavaScript中各种编码解码函数的区别和注意事项
Aug 19 #Javascript
jquery插件之easing使用
Aug 19 #Javascript
为Extjs加加速(javascript加速)
Aug 19 #Javascript
原创javascript小游戏实现代码
Aug 19 #Javascript
jQuery与ExtJS之选择实例分析
Aug 19 #Javascript
JQuery跨Iframe选择实现代码
Aug 19 #Javascript
You might like
为查询结果建立向后/向前按钮
2006/10/09 PHP
ThinkPHP写第一个模块应用
2012/02/20 PHP
新浪SAE搭建PHP项目教程
2015/01/28 PHP
php使用 readfile() 函数设置文件大小大小的方法
2017/08/11 PHP
JObj预览一个JS的框架
2008/03/13 Javascript
checkbox 多选框 联动实现代码
2008/10/22 Javascript
javascript下数值型比较难点说明
2010/06/07 Javascript
javascript与webservice的通信实现代码
2010/12/25 Javascript
jQuery中setTimeout的几种使用方法小结
2013/04/07 Javascript
分享9个最好用的JavaScript开发工具和代码编辑器
2015/03/24 Javascript
javascript关于运动的各种问题经典总结
2015/04/27 Javascript
JavaScript编写点击查看大图的页面半透明遮罩层效果实例
2016/05/09 Javascript
基于jquery插件编写countdown计时器
2016/06/12 Javascript
鼠标点击input,显示瞬间的边框颜色,对之修改与隐藏实例
2016/12/26 Javascript
Kotlin学习第一步 kotlin语法特性
2017/05/25 Javascript
清空元素html("") innerHTML="" 与 empty()的区别和应用(推荐)
2017/08/14 Javascript
jquery ztree实现右键收藏功能
2017/11/20 jQuery
关于Vue组件库开发详析
2018/07/01 Javascript
Nodejs调用Dll模块的方法
2018/09/17 NodeJs
Node.js Stream ondata触发时机与顺序的探索
2019/03/08 Javascript
微信小程序BindTap快速连续点击目标页面跳转多次问题处理
2019/04/08 Javascript
JavaScript冒泡算法原理与实现方法深入理解
2020/06/04 Javascript
Python enumerate遍历数组示例应用
2008/09/06 Python
机器学习经典算法-logistic回归代码详解
2017/12/22 Python
python通过zabbix api获取主机
2018/09/17 Python
python框架django项目部署相关知识详解
2019/11/04 Python
Pytorch 卷积中的 Input Shape用法
2020/06/29 Python
详解CSS3+JS完美实现放大镜模式
2020/12/03 HTML / CSS
KIKO MILANO荷兰网上商店:意大利专业化妆品品牌
2017/05/12 全球购物
Nike香港官网:Nike HK
2019/03/23 全球购物
Java里面有没有全局变量?为什么?
2015/02/06 面试题
计算机专业毕业生自荐信
2013/12/31 职场文书
致裁判员加油稿
2014/02/08 职场文书
安全生产目标责任书
2014/04/14 职场文书
刑事申诉状范文
2015/05/20 职场文书
使用Cargo工具高效创建Rust项目
2022/08/14 Javascript