相思资源网 Design By www.200059.com

本文实例讲述了js实现图片和链接文字同步切换特效的方法。分享给大家供大家参考。具体实现方法如下:

复制代码 代码如下:<html>
<title>js图片和链接文字同步切换特效</title>
<head>
<script language=JavaScript>
var imgUrl=new Array();
var imgLink=new Array();
var imgTz=new Array();
var adNum=0;
imgUrl[1]="/images/m01.jpg";
imgLink[1]="https://www.jb51.net";
imgTz[1]="<a href=#><font color=white>文字链接内容一 红叶传情</font></a>";
imgUrl[2]="/images/m02.jpg";
imgLink[2]="https://www.jb51.net";
imgTz[2]="<a href=#><font color=white>文字链接内容二 野花绽放</font></a>";
imgUrl[3]="/images/m03.jpg";
imgLink[3]="https://www.jb51.net";
imgTz[3]="<a href=#><font color=white>文字链接内容三 往事如茶</font></a>";
var j=0;
for (i=1;i<=3;i++) {
if( (imgUrl[i]!="") && (imgLink[i]!="") ) {
j++;
} else {
break;
}
}
function playTran(){
if (document.all)
imgInit.filters.revealTrans.play();
}
var key=0;
function nextAd(){
if(adNum<j)adNum++ ;
else adNum=1;
if( key==0 ){
key=1;
} else if (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);
}
function goUrl(){
jumpUrl=imgLink[adNum];
jumpTarget='_blank';
if (jumpUrl != ''){
if (jumpTarget != '')
window.open(jumpUrl,jumpTarget);
else
location.href=jumpUrl;
}
}
</script>
</head>
<body>
<table><tr><td>  <a href="javascript:goUrl()"><img style="FILTER: revealTrans(duration=2,transition=20); border=0" src="/UploadFiles/2021-04-02/javascript:nextAd()"> </body>
</html>

希望本文所述对大家的javascript程序设计有所帮助。

标签:
js,图片,链接文字,同步切换,特效,方法

相思资源网 Design By www.200059.com
广告合作:本站广告合作请联系QQ:858582 申请时备注:广告合作(否则不回)
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
相思资源网 Design By www.200059.com

评论“js实现图片和链接文字同步切换特效的方法”

暂无js实现图片和链接文字同步切换特效的方法的评论...