本文实例为大家分享了javascript实现循环广告条的具体代码，供大家参考，具体内容如下
html代码:
<!doctype html><html><head><title>rotating banner</title><script src="script07.js"></script><link rel="stylesheet" href="script01.css" rel="external nofollow" ></head><body><p class="centered"><img src="images/reading1.gif" id="adbanner" alt="ad banner"></p></body></html>
css代码：
body {background-color: white;color: black;font-size: 20px;font-family: "lucida grande", verdana,arial, helvetica, sans-serif;}h1, th {font-family: georgia, "times new roman",times, serif;}h1 {font-size: 28px;}table {border-collapse: collapse;}th, td {padding: 10px;border: 2px #666 solid;text-align: center;width: 20%;}#free, .pickedbg {background-color: #f66;}.winningbg {background-image:url(images/redflash.gif);}
js代码：
window.onload = rotate;var thisad = 0;function rotate() {var adimages = new array("images/ 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;var thisad = 0;function initbannerlink() {if (document.getelementbyid("adbanner").parentnode.tagname == "a") {document.getelementbyid("adbanner").parentnode.onclick = newlocation;}rotate();}function newlocation() {var adurl = new array("negrino.com","sun.com","microsoft.com");document.location.href = "http://www." + adurl[thisad];return false;}function rotate() {var adimages = new array("images/ 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}
上面是我整理给大家的，希望今后会对大家有帮助。
相关文章：
如何利用滚动条位置判断
使用微信小程序如何实现动态设置placeholder提示文字
有关es6/javascript使用技巧（详细教程）
在nodejs中如何实现爬取网站图片
以上就是在javascript中如何实现循环广告条的详细内容。