js实现多张图片切换效果

js实现多张图片切换效果

<script language="JavaScript"> var imgUrl=new Array(); var imgLink=new Array(); var imgText=new Array(); var picNum=0; imgUrl[1]="图片地址一"; imgLink[1]="链接1"; imgText[1]="标题或简介或其它HTML内容1"; imgUrl[2]="图片地址二"; imgLink[2]="链接2"; imgText[2]="标题或简介或其它HTML内容2"; imgUrl[3]="图片地址三"; imgLink[3]="链接3"; imgText[3]="标题或简介或其它HTML内容3"; imgUrl[4]="图片地址四"; imgLink[4]="链接4"; imgText[4]="标题或简介或其它HTML内容4"; imgUrl[5]="图片地址五"; imgLink[5]="链接5"; imgText[5]="标题或简介或其它HTML内容5"; function NextPic(){     if(picNum<4) picNum++ ;//显示4个图片     else picNum=1;     if (document.all){         //下面注意，如果存在于FORM表单中，需要使用下面的方法，否则可直接使用name。         document.imgInit.filters.revealTrans.Transition=Math.floor(Math.random()*23);         document.imgInit.filters.revealTrans.apply();         document.imgInit.filters.revealTrans.play();     }     document.images.imgInit.src="/blog/imgUrl[picNum]";     //如果不是图片，而是SWF等，可做判断，内容可在程序中做好，再放于下面。     focustext.innerHTML='<a href="/blog/+imgLink[picNum]+" target=_blank>'+imgText[picNum]+'</a>';     //设置翻页时间     theTimer=setTimeout('NextPic()', 3000); } function goUrl(){     window.open(imgLink[picNum],'_blank'); } </script> HTML代码中： 可以做到控件中 <TABLE cellPadding=0 width=100% border=0>         <TR>           <TD align=middle height="140" > <div align='center'> <a href='javascript:goUrl()'><img style="FILTER: revealTrans(duration=2,Transition=5)" src="javascript:NextPic()" width="170" height="120" border="1"  id=imgInit name=imgInit></a></TD></TR> <TR><TD align=middle height="38" ><div name=focustext id=focustext align='center'></div> </div> </TD></TR></TABLE>