js实现多张图片切换效果

最新推荐文章于 2022-11-02 18:55:19 发布

最新推荐文章于 2022-11-02 18:55:19 发布 · 410 阅读

文章标签：

js实现多张图片切换效果

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>