javascript实现循环广告条效果
本文实例为大家分享了javascript实现循环广告条的具体代码,供大家参考,具体内容如下
html代码:
RotatingBanner 
css代码:
body{
background-color:white;
color:black;
font-size:20px;
font-family:"LucidaGrande",Verdana,Arial,Helvetica,sans-serif;
}
h1,th{
font-family:Georgia,"TimesNewRoman",Times,serif;
}
h1{
font-size:28px;
}
table{
border-collapse:collapse;
}
th,td{
padding:10px;
border:2px#666solid;
text-align:center;
width:20%;
}
#free,.pickedBG{
background-color:#f66;
}
.winningBG{
background-image:url(images/redFlash.gif);
}
js代码:
window.onload=rotate;
varthisAd=0;
functionrotate(){
varadImages=newArray("http://dh.wk163.comimages/reading1.gif","images/reading2.gif","images/reading3.gif");
thisAd++;
if(thisAd==adImages.length){
thisAd=0;
}
document.getElementById("adBanner").src=adImages[thisAd];
setTimeout(rotate,3*1000);//设置时间,本每隔多长时间改变广告条中的GIF
}
在循环广告条中添加链接:修改js的代码
window.onload=initBannerLink;
varthisAd=0;
functioninitBannerLink(){
if(document.getElementById("adBanner").parentNode.tagName=="A"){
document.getElementById("adBanner").parentNode.onclick=newLocation;
}
rotate();
}
functionnewLocation(){
varadURL=newArray("negrino.com","sun.com","microsoft.com");
document.location.href="http://www."+adURL[thisAd];
returnfalse;
}
functionrotate(){
varadImages=newArray("http://dh.wk163.comimages/reading1.gif","images/reading2.gif","images/reading3.gif");
thisAd++;
if(thisAd==adImages.length){
thisAd=0;
}
document.getElementById("adBanner").src=adImages[thisAd];
setTimeout(rotate,3*1000);//设置时间,本每隔多长时间改变广告条中的GIF
}
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持毛票票。