JS+Flash 图片轮播

用法力求简单，将imageShow.js加入到网页中需要进行图片轮播的地方即可，JS内容为（可在附近里面下载）。

var pic_width=943; //图片宽度

var pic_height=354; //图片高度

var stop_time=4000; //图片停留时间(1000为1秒钟)

var switch_type=-1;//图片切换方式

var speed = 3;//图片切换速度，以秒计算

var imag=new Array();//图片

var imglink = new Array();//图片链接

//可编辑内容结束

imag[1]="E:\\FlashEx\\imageSwitch\\imageSwitch\\src\\images\\6.jpg";

imag[2]="E:\\FlashEx\\imageSwitch\\imageSwitch\\src\\images\\7.jpg";

imag[3]="E:\\FlashEx\\imageSwitch\\imageSwitch\\src\\images\\3.jpg";

imag[4]="E:\\FlashEx\\imageSwitch\\imageSwitch\\src\\images\\4.jpg";

imag[5]="E:\\FlashEx\\imageSwitch\\imageSwitch\\src\\images\\5.jpg";

imglink[1]="page/index.html";

imglink[2]="page/news.html";

imglink[3]="page/ppzs.html";

imglink[4]="page/server.html";

imglink[5]="page/shiping.html";

var swf_height=pic_height;

var pics="",  texts="",imglinks="";

for(var i=1; i<imag.length; i++){

pics=pics+("|"+imag[i]);

imglinks = imglinks+("|"+imglink[i]);

}

pics=pics.substring(1);

imglinks = imglinks.substring(1);

document.write('<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cabversion=6,0,0,0" width="'+ pic_width +'" height="'+ swf_height +'">');

document.write('<param name="movie" value="imageShow.swf">');

document.write('<param name="quality" value="high"><param name="wmode" value="opaque">');

document.write('<param name="FlashVars" value="pics='+pics+'&pic_width='+pic_width+'&pic_height='+pic_height+' &imglinks='+imglinks+' &speed='+speed+' &switch_type='+switch_type+'&stop_time='+stop_time+'">');

document.write('<embed wmode="transparent" src="imageShow.swf" FlashVars="pics='+pics+'&pic_width='+pic_width+'&pic_height='+pic_height+" &imglinks="+imglinks+' &speed='+speed+' &switch_type='+switch_type+'&stop_time='+stop_time+'" quality="high" width="'+ pic_width +'" height="'+ swf_height +'" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />');

document.write('</object>');

如上所示，一共有7个参数可供设置

var pic_width=943; //图片宽度

var pic_height=354; //图片高度

var stop_time=4000; //图片停留时间(1000为1秒钟)

var switch_type=-1;//图片切换方式，-1代表随机，从0至12

var speed = 3;//图片切换速度，以秒计算

var imag=new Array();//图片

var imglink = new Array();//图片链接

程序原理：

图片的切换过程主要是借助了AS3自带的TransitionManager图片切换类来完成的，要注意的问题是如何将要展示的图片深度调到最高。我是利用下面的方法进行深度排列的

//重新排列深度

private function resetDepth(depth:Number):void {

imageContainer.swapChildrenAt(imageNum - 2, imageNum - 1);//将最后两个元素交换

imageContainer.swapChildrenAt(imageContainer.getChildIndex(images[depth]), imageNum-1);//将当前元素与最后一个元素交换

}

先将最后两个元素交换，以达到播放下一张图片时，背景显示的是前一张已经播放完的图片。

然后将当前元素与最后一个元素交换，将达到显示出当前元素的目的。

浏览器支持：

IE6+,Firefox,opera,safari(其它的没测试，应该没问题)