js实现图片和链接文字同步切换特效的方法
本文实例讲述了js实现图片和链接文字同步切换特效的方法。分享给大家供大家参考。具体实现方法如下:
<html>
<title>js图片和链接文字同步切换特效</title>
<head>
<scriptlanguage=JavaScript>
varimgUrl=newArray();
varimgLink=newArray();
varimgTz=newArray();
varadNum=0;
imgUrl[1]="/images/m01.jpg";
imgLink[1]="https://www.nhooo.com";
imgTz[1]="<ahref=#><fontcolor=white>文字链接内容一红叶传情</font></a>";
imgUrl[2]="/images/m02.jpg";
imgLink[2]="https://www.nhooo.com";
imgTz[2]="<ahref=#><fontcolor=white>文字链接内容二野花绽放</font></a>";
imgUrl[3]="/images/m03.jpg";
imgLink[3]="https://www.nhooo.com";
imgTz[3]="<ahref=#><fontcolor=white>文字链接内容三往事如茶</font></a>";
varj=0;
for(i=1;i<=3;i++){
if((imgUrl[i]!="")&&(imgLink[i]!="")){
j++;
}else{
break;
}
}
functionplayTran(){
if(document.all)
imgInit.filters.revealTrans.play();
}
varkey=0;
functionnextAd(){
if(adNum<j)adNum++;
elseadNum=1;
if(key==0){
key=1;
}elseif(document.all){
imgInit.filters.revealTrans.Transition=6;
imgInit.filters.revealTrans.apply();
playTran();
}
document.images.imgInit.src=imgUrl[adNum];
document.getElementById('jdtz').innerHTML=imgTz[adNum];
theTimer=setTimeout("nextAd()",3000);
}
functiongoUrl(){
jumpUrl=imgLink[adNum];
jumpTarget='_blank';
if(jumpUrl!=''){
if(jumpTarget!='')
window.open(jumpUrl,jumpTarget);
else
location.href=jumpUrl;
}
}
</script>
</head>
<body>
<table><tr><td> <ahref="javascript:goUrl()"><imgstyle="FILTER:revealTrans(duration=2,transition=20);border=0"src="javascript:nextAd()" width=320height=240border=0 name=imgInit></a></td></tr><tr><tdid=jdtz bgcolor="blue"></td></tr></table>
</body>
</html>
希望本文所述对大家的javascript程序设计有所帮助。