用JS+CSS实现多种图片漂亮效果的代码

代码简介：

JS+CSS实现多种图片过渡效果，模切、竖切、百叶窗、还有马赛克、淡入淡出、透明度变化等，有一些是我们经常会用到了，很好的一段代码，点击运行查看一下效果，如果没看到，请刷新一下页面再试。

代码内容：

View Code

< html >
< head >
< meta  http-equiv ="Content-Type"  content ="text/html; charset=gb2312" >
< title >用JS+CSS实现多种图片漂亮效果的代码 - www.webdm.cn </ title >
</ head >
< body >
< script  for =window  event =onLoad  language =vbscript >
    image1.filters.item( 0 ).apply()
    image1.filters.item( 0 ).transition  =   10
    image1.Style.visibility  =   ""
    image1.filters( 0 ).play( 2.0 )
    image2.filters.item( 0 ).apply()
    image2.filters.item( 0 ).transition  =   11
    image2.Style.visibility  =   ""
    image2.filters( 0 ).play( 2.0 )
    image3.filters.item( 0 ).apply()
    image3.filters.item( 0 ).transition  =   12
    image3.Style.visibility  =   ""
    image3.filters( 0 ).play( 2.0 )
    image4.filters.item( 0 ).apply()
    image4.filters.item( 0 ).transition  =   13
    image4.Style.visibility  =   ""
    image4.filters( 0 ).play( 2.0 )
    image5.filters.item( 0 ).apply()
    image5.filters.item( 0 ).transition  =   14
    image5.Style.visibility  =   ""
    image5.filters( 0 ).play( 2.0 )
    image6.filters.item( 0 ).apply()
    image6.filters.item( 0 ).transition  =   15
    image6.Style.visibility  =   ""
    image6.filters( 0 ).play( 2.0 )
</ script >
< img  src ="http://www.webdm.cn/images/wall1_s.jpg
"  border =0  id ="image1"  style ="visibility:hidden; FILTER:revealTrans(Duration=4.0, Transition=23);"  width ="140"  height ="105"   /> 
       < img  src ="http://www.webdm.cn/images/wall2_s.jpg
"  border =0  id ="image2"  style ="visibility:hidden; FILTER:revealTrans(Duration=4.0, Transition=22);"  width ="140"  height ="105"   /> 
   < img  src ="http://www.webdm.cn/images/wall3_s.jpg
"  border =0  id ="image3"  style ="visibility:hidden; FILTER:revealTrans(Duration=4.0, Transition=23);"  width ="140"  height ="105"   /> 
       < img  src ="http://www.webdm.cn/images/wall4_s.jpg
"  border =0  id ="image4"  style ="visibility:hidden; FILTER:revealTrans(Duration=4.0, Transition=22);"  width ="140"  height ="105"   /> 
   < img  src ="http://www.webdm.cn/images/wall5_s.jpg
"  border =0  id ="image5"  style ="visibility:hidden; FILTER:revealTrans(Duration=4.0, Transition=22);"  width ="140"  height ="105"   /> 
       < img  src ="http://www.webdm.cn/images/wall6_s.jpg
"  border =0  id ="image6"  style ="visibility:hidden; FILTER:revealTrans(Duration=4.0, Transition=22);"  width ="140"  height ="105"   />
</ body >
</ html >
< br  />
< p >< a  href ="http://www.webdm.cn" >网页代码站 </ a > - 最专业的网页代码下载网站 - 致力为中国站长提供有质量的网页代码！ </ p >
代码来自：http://www.webdm.cn/webcode/6a432bee-331a-474f-b541-d8f74c8d2dab.html

 

 

转载于:https://www.cnblogs.com/webdm/archive/2011/09/29/2195319.html