一例极简洁的JS幻灯特效


　　常见的代码幻灯片特效，是用时间代码实现的。这样做，代码量较大，但在论坛中，一般可直接发帖，不会有什么问题。
　　应用JS语言编程，使事情变得特别简单，代码极少，更换、增减图片素材也非常方便。但有一个问题，这就是在论坛下不能采用代码直接发帖。若论坛的设置允许，可采用框架（iframe）或控件（object）方式发帖。这是网站网页常用的方式。
　　下面是一个实例效果。与有兴趣的朋友讨论、把玩。


计数



　　这里列出相应的网页代码，用于交流、探讨。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>一例极简洁的JS幻灯特效</title>
</head>
<body bgcolor="#339999">
<!--********************************************************************************-->
<center>
<img id="fc" style="filter:revealTrans(); position: relative; left: 0; top: 0; width: 600px; height: 460px" src="http://2010.hnzqw.com/UploadFile/2010-12/201012613594059962.jpg" border="0">
</center>
<!--********************************************************************************-->
<script language = "JavaScript">　　　　　　　　　　　　　　　　 //脚本标签

var pic = new Array();　　　　　　　　　　　　　　　　　　　　　 //图片地址的数组
pic[0] = "201012613594059962.jpg";
pic[1] = "20101261415857643.jpg";
pic[2] = "201012414403266359.jpg";
pic[3] = "20101261413747074.jpg";
pic[4] = "20101241619442251.jpg";
pic[5] = "2010126141725925.jpg";
pic[6] = "20101261402836589.jpg";
pic[7] = "20101261401248119.jpg";
pic[8] = "2010126140226405.jpg";
pic[9] = "201012613595042153.jpg";
<!-------------------------------------------------------------------------------------------------->
var k = 1;　　　　　　　　　　　　　　　　　　　　　　  //用于计数的变量，初始值为1；
function slide(){　　　　　　　　　　　　　　　　　　　 //命名一个函数；
　  fc.filters.item(0).Apply();　　　　　　　　　　　　　　　　　　  //应用滤镜效果；
　  fc.filters.revealTrans.Transition = 23;　　　　　　　　　　　　　 //滤镜效果，随机选择更换；
　  fc.src = "http://2010.hnzqw.com/UploadFile/2010-12/" + pic[k];　　  //下一个显示的图片；
　  fc.filters.revealTrans.play(2);　　　　　　　　　　　　　　 //显示滤镜效果，更换图片，耗时2秒；　 
　  k++　　　　　　　　　　　　　　　　　　　　　　　　  //计数变量加1；
　  if (k == pic.length)　　　　　　　　　　　　　　　　　　  //判断图片如果都用完了；
　  k = 0;　　　　　　　　　　　　　　　　　　　　　　　　 //图片又从第一张开始显示；
　  setTimeout("slide()", 5000)　　　　　　　　　　　　　　 //更换图片的时间相隔5秒；
}
setTimeout("slide()", 3000);　　　　　　　　　　　　　　　  //第一次等待3秒开始更换图片；

</script>
<!--********************************************************************************-->
</body>
</html>

　　将上面的代码（注释内容可以不删除）全部粘贴到一个文本文件中（扩展名也可改为htm），上传，然后将地址嵌在下面的代码中，就可以在允许的论坛中发帖了。坛子里可以用这种方式发帖。

<iframe style="LEFT: -206px; WIDTH: 1000px; POSITION: relative; TOP: 0px; HEIGHT: 500px"  marginWidth=0 marginHeight=0 src="http://webftp.bbs.hnol.net/dysr/201101/clock_html_110204/110217.htm" frameBorder=0><iframe>

　　代码中，黄色字符与对象的链接相关，绿色字符与对象的尺寸相关。更换图片元素，仅变更这两部分即可。数量可随意增减，但格式、标点不能错。数量值由编程自动处理。
　　整个网页代码，分隔成五段（方便阅读）。
　　第一、五段只与网页有关，可不理会；
　　第二段是图片对象的代码，很普通，与平常的一样，仅增加了id号，其他的内容为：滤镜、定位、尺寸、链接地址。链接地址为数组中第一项的地址。
　　第三、四段为JS内容。第三段为图片链接地址的数组；第四段为控制编程，详见注释。
　　数组中的链接内容采用的偷懒的方式，仅记入各链接中不同内容的部分，在使用时，在这一句中“fc.src = "http://2010.hnzqw.com/UploadFile/2010-12/" + pic[k];”再“拼接”成完整的链接。★如果在数组中记入的是完整的地址，则这一句须改为“fc.src = pic[k];”。
　　发帖时，如果内容没有正确显示，可调整一下发帖的高度值。
　　为体现此例的“简洁”，在效果上未增加任何“装饰”性的内容，尝试时尽可按自己的喜好自行处理。