CSS中有revealTrans滤镜在网页中制作特效非常有用处。这次,我们准备介绍另一种使用revealTrans滤镜制作出超弦图片播放的效果。 
  实现思路:使用revealTrans滤镜制作出超弦图片播放的效果,并每张图片有各自的链接地址。
  制作方法:
  1、在<head>中插入JS代码:
<SCRIPTlanguage=JavaScript1.2> 
functionreapply(){ 
setTimeout("slideit()",800) 
returntrue 
} 
window.onerror=reapply 
</SCRIPT> 
<SCRIPTlanguage=JavaScript1.1> 
<!-- 
//preloadimages 
varimage1=newImage() 
image1.src=图片地址" 
varimage2=newImage() 
image2.src=图片地址" 
varimage3=newImage() 
image3.src=图片地址" 
varimage4=newImage() 
image4.src=图片地址" 
varimage5=newImage() 
image5.src=图片地址" 
varimage6=newImage() 
image6.src=图片地址" 
varimage7=newImage() 
image7.src=图片地址" 
varimage8=newImage() 
image8.src=图片地址" 
varimage9=newImage() 
image9.src=图片地址" 
//--> 
</SCRIPT>
  其中:images/图片地址为显示图片的路径,可按实际情况修改。
  2、在<body>中插入代码:onload=slideit()
  3、在页面中插入图片。
 并在图片<img>中插入:style="FILTER: revealTrans(Duration=2, Transition=23)",并命名为:name=slide
  完整代码:<img src=http://www.jb51.net/css/连接地址"images/图片地址" width="120" height="90" border="0" style="FILTER: revealTrans(Duration=2, Transition=23)" name=slide>
  4、给图片加超链接:<a href=http://www.jb51.net/css/"JavaScript:slidelink()">
  5、加入代码:
<SCRIPT> 
<!-- 
////changenumberofimagesbelow 
varnumber_of_images=9 
//changespeedbelow(inseconds) 
varspeed=3 
varstep=1 
varwhichimage=1 
functionslideit(){ 
if(!document.images) 
return 
if(document.all) 
slide.filters.item(0).Apply() 
document.images.slide.src=eval("image" step ".src") 
if(document.all) 
slide.filters.item(0).Play() 
whichimage=step 
if(step<number_of_images) 
step   
else 
step=1 
if(document.all) 
setTimeout("slideit()",speed*1000 3000) 
else 
setTimeout("slideit()",speed*1000) 
} 
functionslidelink(){ 
if(whichimage==1) 
top.location.href=图片地址"/index.HTML" 
if(whichimage==2) 
top.location.href=图片地址"/news.HTML" 
if(whichimage==3) 
top.location.href=图片地址"/game.HTML" 
if(whichimage==4) 
top.location.href=图片地址"/music.HTML" 
if(whichimage==5) 
top.location.href=图片地址"/sport.HTML" 
if(whichimage==6) 
top.location.href=图片地址"/radio.HTML" 
if(whichimage==7) 
top.location.href=图片地址"/travel.HTML" 
if(whichimage==8) 
top.location.href=图片地址"/card.JSP" 
elseif(whichimage==9) 
top.location.href=图片地址"/study.HTML" 
} 
</SCRIPT>
  其中:各链接地址相对应<head>中插入的JS代码中的图片。
  注意,页面地址必须与图片张数相对应。