标题: 图形切换效果的收集之CSS渐变滤镜大全 [打印本页]

---

作者: fangzhen    时间: 2009-12-23 13:59     标题: 图形切换效果的收集之CSS渐变滤镜大全

图形变换滤镜的收集（CSS渐变滤镜大全） <!--图型变换代码如下.     23.随机变换效果            type="progid:DXImageTransform.Microsoft.RevealTrans(enabled=ture,transition=23)"
      
       0.方形逐渐变小            type="progid:DXImageTransform.Microsoft.Iris(irisstyle=square,motion=in)"
        交叉形逐渐变大        type="progid:DXImageTransform.Microsoft.Iris(irisstyle=cross,motion=out)"
        菱形逐渐变小            type="progid:DXImageTransform.Microsoft.Iris(irisstyle=diamond,motion=in)"        1.方形逐渐变大            type="progid:DXImageTransform.Microsoft.Iris(irisstyle=square,motion=out)"
        交叉形逐渐变小        type="progid:DXImageTransform.Microsoft.Iris(irisstyle=cross,motion=in)"
        菱形逐渐变大            type="progid:DXImageTransform.Microsoft.Iris(irisstyle=diamond,motion=out)"
                              
       2.圆形逐渐变小            type="progid:DXImageTransform.Microsoft.Iris(irisstyle=circle,motion=in)"
        加号形逐渐变大        type="progid:DXImageTransform.Microsoft.Iris(irisstyle=plus,motion=out)"
        星形逐渐变小            type="progid:DXImageTransform.Microsoft.Iris(irisstyle=star,motion=in)"        3.圆形逐渐变大            type="progid:DXImageTransform.Microsoft.Iris(irisstyle=circle,motion=out)"
        加号形逐渐变小        type="progid:DXImageTransform.Microsoft.Iris(irisstyle=plus,motion=in)"
        星形逐渐变大            type="progid:DXImageTransform.Microsoft.Iris(irisstyle=star,motion=out)"
      
       4.向上逐渐擦除            type="progid:DXImageTransform.Microsoft.Blinds(bands=1,direction=up)"
      
       5.向下逐渐擦除            type="progid:DXImageTransform.Microsoft.Blinds(bands=1,direction=down)"
      
       6.向左逐渐擦除            type="progid:DXImageTransform.Microsoft.Blinds(bands=1,direction=left)"
      
       7.向右逐渐擦除            type="progid:DXImageTransform.Microsoft.Blinds(bands=1,direction=right)"
      
       8.垂直百叶窗效果        type="progid:DXImageTransform.Microsoft.Blinds(bands=6,direction=right)"
                               type="progid:DXImageTransform.Microsoft.Blinds(bands=6,direction=left)"
                               type="progid:DXImageTransform.Microsoft.Blinds(bands=60,direction=right)"
                               type="progid:DXImageTransform.Microsoft.Blinds(bands=60,direction=left)"
      
       9.水平百叶窗效果        type="progid:DXImageTransform.Microsoft.Blinds(bands=6,direction=down)"
                               type="progid:DXImageTransform.Microsoft.Blinds(bands=6,direction=up)"
                               type="progid:DXImageTransform.Microsoft.Blinds(bands=60,direction=down)"
                               type="progid:DXImageTransform.Microsoft.Blinds(bands=60,direction=up)"
               
       10.横向棋盘效果            type="progid:DXImageTransform.Microsoft.CheckerBoard(direction=down,squaresX=12,squaresY=12)"
                               type="progid:DXImageTransform.Microsoft.CheckerBoard(direction=up,squaresX=12,squaresY=12)"
                               type="progid:DXImageTransform.Microsoft.Checkerboard(direction=down,squaresX=2,squaresY=2)"
                               type="progid:DXImageTransform.Microsoft.Checkerboard(direction=up,squaresX=2,squaresY=2)"
                               type="progid:DXImageTransform.Microsoft.Checkerboard(direction=down,squaresX=60,squaresY=60)"
                               type="progid:DXImageTransform.Microsoft.Checkerboard(direction=up,squaresX=60,squaresY=60)"
               
       11.纵向棋盘效果            type="progid:DXImageTransform.Microsoft.CheckerBoard(direction=right,squaresX=12,squaresY=12)"
                               type="progid:DXImageTransform.Microsoft.CheckerBoard(direction=left,squaresX=12,squaresY=12)"
                               type="progid:DXImageTransform.Microsoft.Checkerboard(direction=right,squaresX=2,squaresY=2)"
                               type="progid:DXImageTransform.Microsoft.Checkerboard(direction=left,squaresX=2,squaresY=2)"
                               type="progid:DXImageTransform.Microsoft.Checkerboard(direction=right,squaresX=60,squaresY=60)"
                               type="progid:DXImageTransform.Microsoft.Checkerboard(direction=left,squaresX=60,squaresY=60)"
           
       12.随机溶解效果            type="progid:DXImageTransform.Microsoft.RandomDissolve(enable=true)"
      
       13.左右向中部收缩        type="progid:DXImageTransform.Microsoft.Barn(motion=in,orientation=vertical)"
      
       14.中部向左右展开        type="progid:DXImageTransform.Microsoft.Barn(motion=out,orientation=vertical)"
      
       15.上下向中部收缩        type="progid:DXImageTransform.Microsoft.Barn(motion=in,orientation=horizontal)"
      
       16.中部向上下展开        type="progid:DXImageTransform.Microsoft.Barn(motion=out,orientation=horizontal)"
      
       17.阶梯状向左下展开        type="progid:DXImageTransform.Microsoft.Strips(motion=leftdown)"
      
       18.阶梯状向左上展开        type="progid:DXImageTransform.Microsoft.Strips(motion=leftup)"
      
       19.阶梯状向右下展开        type="progid:DXImageTransform.Microsoft.Strips(motion=rightdown)"
      
       20.阶梯状向右上展开        type="progid:DXImageTransform.Microsoft.Strips(motion=rightup)"
      
       21.随机水平线效果        type="progid:DXImageTransform.Microsoft.RandomBars(orientation=horizontal)"
      
       22.随机垂直线效果        type="progid:DXImageTransform.Microsoft.RandomBars(orientation=vertical)"
      
       24.标准渐变转化效果        type="BlendTrans(enabled=true,percent=10)"
      
       25.可调渐变转化效果        type="progid:DXImageTransform.Microsoft.Fade(enabled=ture,overlap=1.0)"
      
       26.向右下插入效果        type="progid:DXImageTransform.Microsoft.Inset(enabled=ture)"
      
       27.马赛克效果            type="progid:DXImageTransform.Microsoft.Pixelate(maxSquare=20)"
      
       28.时钟形射线擦除        type="progid:DXImageTransform.Microsoft.RadialWipe(wipestyle=clock)"
       29.楔子形射线擦除        type="progid:DXImageTransform.Microsoft.RadialWipe(wipestyle=wedge)"
       30.辐射形射线擦除        type="progid:DXImageTransform.Microsoft.RadialWipe(wipestyle=radial)"
      
       31.隐藏式幻灯片效果        type="progid:DXImageTransform.Microsoft.Slide(slidestyle=hide,bands=1)"
                               type="progid:DXImageTransform.Microsoft.Slide(slidestyle=hide,bands=20)"
       32.推动式幻灯片效果        type="progid:DXImageTransform.Microsoft.Slide(slidestyle=push,bands=1)"
                               type="progid:DXImageTransform.Microsoft.Slide(slidestyle=push,bands=20)"
       33.交换式幻灯片效果        type="progid:DXImageTransform.Microsoft.Slide(slidestyle=swap,bands=1)"
                               type="progid:DXImageTransform.Microsoft.Slide(slidestyle=swap,bands=20)"
      
       34.螺旋形收缩效果        type="progid:DXImageTransform.Microsoft.Spiral(gridSizeX=20,gridSizeY=20)"
      
       35.隐藏式伸展效果        type="progid:DXImageTransform.Microsoft.Stretch(stretchstyle=hide)"
       36.推动式伸展效果        type="progid:DXImageTransform.Microsoft.Stretch(stretchstyle=push)"
       37.旋转式伸展效果        type="progid:DXImageTransform.Microsoft.Stretch(stretchstyle=spin)"
      
       38.风车轮转动效果        type="progid:DXImageTransform.Microsoft.Wheel(spokes=20)"
      
       39.梯度擦除效果            type="progid:DXImageTransform.Microsoft.GradientWipe(GradientSize=0.5,wipestyle=0,motion=forward)"
                               type="progid:DXImageTransform.Microsoft.GradientWipe(GradientSize=0.5,wipestyle=0,motion=reverse)"
                               type="progid:DXImageTransform.Microsoft.GradientWipe(GradientSize=0.5,wipestyle=1,motion=forward)"
                               type="progid:DXImageTransform.Microsoft.GradientWipe(GradientSize=0.5,wipestyle=1,motion=reverse)"        40.Z字形曲折效果        type="progid:DXImageTransform.Microsoft.Zigzag(gridSizeX=20,gridSizeY=20)" -->
注:头23个滤镜（指有标号的）是常见滤镜，均可用第23号滤镜（排在文章中的第一种滤镜）变换参数获得。如1号滤镜可以将23号滤镜中的transition=23改为transition=1，其余同。

---

欢迎光临 PHP开发笔记 (http://phpvi.com/)

Powered by Discuz! 6.1.0