itRef.cn技术参考网站

当前位置: 主页 > CSS >

smil切换使用IE滤镜近似替换对照表

时间:2011-05-11 11:44来源:未知 作者:wiwi 点击:
SMIL是同步多媒体集成语言,RealOne就可以按照SMIL文件中组织的影音资源来播放。SMIL也有应用于彩信格式。 SMIL有多种变换格式,以下就常用的一些变换与近似的IE CSS滤镜相对照。 *. 图片从左到右拉开 seq trans-type= open trans-subtype= l img //seq filt

SMIL是同步多媒体集成语言,RealOne就可以按照SMIL文件中组织的影音资源来播放。SMIL也有应用于彩信格式。

SMIL有多种变换格式,以下就常用的一些变换与近似的IE CSS滤镜相对照。

   *. 图片从左到右拉开                  <seq trans-type="open" trans-subtype="l"><img /></seq>
      filter : progid:DXImageTransform.Microsoft.RevealTrans ( duration=1,transition=6 ) ;

   *. 图片从右到左拉开                  <seq trans-type="open" trans-subtype="r"><img /></seq>
      filter : progid:DXImageTransform.Microsoft.RevealTrans ( duration=1,transition=7 ) ;

   *. 图片从上往下拉开                  <seq trans-type="open" trans-subtype="t"><img /></seq>
      filter : progid:DXImageTransform.Microsoft.RevealTrans ( duration=1,transition=5 ) ;  

   *. 图片从下往上拉开                  <seq trans-type="open" trans-subtype="b"><img /></seq>
      filter : progid:DXImageTransform.Microsoft.RevealTrans ( duration=1,transition=4 ) ;

   *. 图片从中间往左右两边横向拉开      <seq trans-type="open" trans-subtype="ml"><img /></seq>
      filter : progid:DXImageTransform.Microsoft.RevealTrans ( duration=1,transition=14 ) ;

   *. 图片从左右两边往中间横向拉开      <seq trans-type="open" trans-subtype="lm"><img /></seq>
      filter : progid:DXImageTransform.Microsoft.RevealTrans ( duration=1,transition=13 ) ;

   *. 图片从中间往上下两边纵向拉开      <seq trans-type="open" trans-subtype="mt"><img /></seq>
      filter : progid:DXImageTransform.Microsoft.RevealTrans ( duration=1,transition=16 ) ;

   *. 图片从上下两边往中间纵向拉开      <seq trans-type="open" trans-subtype="tm"><img /></seq>
      filter : progid:DXImageTransform.Microsoft.RevealTrans ( duration=1,transition=15) ;

   *. 图片从中间正中矩形向外扩散        <seq trans-type="open2" trans-subtype="rect"><img /></seq>
      filter : progid:DXImageTransform.Microsoft.RevealTrans ( duration=1,transition=1 ) ;

   *. 图片从中间圆心向外扩散            <seq trans-type="open2" trans-subtype="circle"><img /></seq>
      filter : progid:DXImageTransform.Microsoft.RevealTrans ( duration=1,transition=3 ) ;

   *. 页面顺时针拉开                    <seq trans-type="open2" trans-subtype="clockwise"><img /></seq>
      filter : progid:DXImageTransform.Microsoft.RadialWipe ( duration=1,wipeStyle=CLOCK ) ;

   *. 页面逆时针拉开                    <seq trans-type="open2" trans-subtype="anticlockwise"><img /></seq>
      filter : progid:DXImageTransform.Microsoft.RadialWipe ( duration=1,wipeStyle=WEDGE ) ;

   *. 页面蛇形展开                      <seq trans-type="open2" trans-subtype="snake"><img /></seq>
      filter : progid:DXImageTransform.Microsoft.Inset ( duration=1 ) ;

   *. 页面从左飞入                      <seq trans-type="fly" trans-subtype="l"><img /></seq>
      filter : progid:DXImageTransform.Microsoft.GradientWipe ( duration=1,gradientSize=0.5,motion=forward ) ; WipeStyle=0

   *. 页面从下方飞入                    <seq trans-type="fly" trans-subtype="b"><img /></seq>
      filter : progid:DXImageTransform.Microsoft.GradientWipe ( duration=1,gradientSize=0.5,motion=reverse ) ; WipeStyle=1

   *. 页面从右边飞入                    <seq trans-type="fly" trans-subtype="r"><img /></seq>
      filter : progid:DXImageTransform.Microsoft.GradientWipe ( duration=1,gradientSize=0.5,motion=reverse ) ; WipeStyle=0

   *. 页面从上飞入                      <seq trans-type="fly" trans-subtype="t"><img /></seq>
      filter : progid:DXImageTransform.Microsoft.GradientWipe ( duration=1,gradientSize=0.5,motion=forward ) ; WipeStyle=1

   *. 页面从左上角飞入                  <seq trans-type="fly" trans-subtype="lt"><img /></seq>
      filter : progid:DXImageTransform.Microsoft.RevealTrans ( duration=1,transition=20 ) ;

   *. 页面从右上角飞入                  <seq trans-type="fly" trans-subtype="rt"><img /></seq>
      filter : progid:DXImageTransform.Microsoft.RevealTrans ( duration=1,transition=17 ) ;

   *. 页面从右下角飞入                  <seq trans-type="fly" trans-subtype="rb"><img /></seq>
      filter : progid:DXImageTransform.Microsoft.RevealTrans ( duration=1,transition=18 ) ;

   *. 页面从左下角飞入                  <seq trans-type="fly" trans-subtype="lb"><img /></seq>
      filter : progid:DXImageTransform.Microsoft.RevealTrans ( duration=1,transition=19 ) ;

   *. 百叶窗切换效果                    <seq trans-type="switch" trans-subtype="blinds"><img /></seq>
      filter : progid:DXImageTransform.Microsoft.Blinds ( duration=0.5,bands=50,Direction=right ) ;

   *. 仿3D旋转翻页效果                  <seq trans-type="switch" trans-subtype="3d"><img /></seq>
      (中间->两边)filter : progid:DXImageTransform.Microsoft.RevealTrans ( duration=1,transition=14 ) ;

   *. 横条形切换效果                    <seq trans-type="switch" trans-subtype="hor"><img /></seq>
      filter : progid:DXImageTransform.Microsoft.RevealTrans ( duration=1,transition=10 ) ;

   *. 口字形切换效果                    <seq trans-type="switch" trans-subtype="mouth"><img /></seq>
      filter : progid:DXImageTransform.Microsoft.CheckerBoard ( duration=0.5,squaresX=20,squaresY=20,Direction=right ) ;

   *. 翻页效果                          <seq trans-type="switch" trans-subtype="page"><img /></seq>
      filter : progid:DXImageTransform.Microsoft.Stretch ( duration=1,stretchStyle=PUSH ) ;

   *. 旋转显示                          <seq trans-type="switch" trans-subtype="spiral"><img /></seq>
      filter : progid:DXImageTransform.Microsoft.Stretch ( duration=1,stretchStyle=SPIN ) ;

   *. 竖条形切换效果                    <seq trans-type="switch" trans-subtype="ver"><img /></seq>
      filter : progid:DXImageTransform.Microsoft.RevealTrans ( duration=1,transition=11 ) ;

注:IE CSS图片切换滤镜,需要指定图片父容器的高度,否则可能导致不出现变换过程(具体原因,还不太清楚,如有谁知道,求分享)

(责任编辑:wiwi) 转载请注明 来源于itRef.cn技术参考网站:
顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
栏目列表
推荐内容