在javascript中如何实现循环广告条
这篇文章主要为大家详细介绍了javascript实现循环广告条效果,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
本文实例为大家分享了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提示文字
以上是在javascript中如何实现循环广告条的详细内容。更多信息请关注PHP中文网其他相关文章!

热AI工具

Undresser.AI Undress
人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover
用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool
免费脱衣服图片

Clothoff.io
AI脱衣机

AI Hentai Generator
免费生成ai无尽的。

热门文章

热工具

记事本++7.3.1
好用且免费的代码编辑器

SublimeText3汉化版
中文版,非常好用

禅工作室 13.0.1
功能强大的PHP集成开发环境

Dreamweaver CS6
视觉化网页开发工具

SublimeText3 Mac版
神级代码编辑软件(SublimeText3)

热门话题

人脸检测识别技术已经是一个比较成熟且应用广泛的技术。而目前最为广泛的互联网应用语言非JS莫属,在Web前端实现人脸检测识别相比后端的人脸识别有优势也有弱势。优势包括减少网络交互、实时识别,大大缩短了用户等待时间,提高了用户体验;弱势是:受到模型大小限制,其中准确率也有限。如何在web端使用js实现人脸检测呢?为了实现Web端人脸识别,需要熟悉相关的编程语言和技术,如JavaScript、HTML、CSS、WebRTC等。同时还需要掌握相关的计算机视觉和人工智能技术。值得注意的是,由于Web端的计

股票分析必备工具:学习PHP和JS绘制蜡烛图的步骤,需要具体代码示例随着互联网和科技的快速发展,股票交易已经成为许多投资者的重要途径之一。而股票分析是投资者决策的重要一环,其中蜡烛图被广泛应用于技术分析中。学习如何使用PHP和JS绘制蜡烛图将为投资者提供更多直观的信息,帮助他们更好地做出决策。蜡烛图是一种以蜡烛形状来展示股票价格的技术图表。它展示了股票价格的

如何使用PHP和JS创建股票蜡烛图股票蜡烛图是股票市场中常见的一种技术分析图形,通过绘制股票的开盘价、收盘价、最高价和最低价等数据,帮助投资者更直观地了解股票的价格波动情况。本文将教你如何使用PHP和JS创建股票蜡烛图,并附上具体的代码示例。一、准备工作在开始之前,我们需要准备以下环境:1.一台运行PHP的服务器2.一个支持HTML5和Canvas的浏览器3

如何使用JS和百度地图实现地图点击事件处理功能概述:在Web开发中,经常需要使用地图功能来展示地理位置和地理信息。而地图上的点击事件处理是地图功能中常用且重要的一部分。本文将介绍如何使用JS和百度地图API来实现地图的点击事件处理功能,并给出具体的代码示例。步骤:导入百度地图的API文件首先,要在HTML文件中导入百度地图API的文件,可以通过以下代码实现:

随着互联网金融的迅速发展,股票投资已经成为了越来越多人的选择。而在股票交易中,蜡烛图是一种常用的技术分析方法,它能够显示股票价格的变化趋势,帮助投资者做出更加精准的决策。本文将通过介绍PHP和JS的开发技巧,带领读者了解如何绘制股票蜡烛图,并提供具体的代码示例。一、了解股票蜡烛图在介绍如何绘制股票蜡烛图之前,我们首先需要了解一下什么是蜡烛图。蜡烛图是由日本人

js和vue的关系:1、JS作为Web开发基石;2、Vue.js作为前端框架的崛起;3、JS与Vue的互补关系;4、JS与Vue的实践应用。

lambda表达式跳出循环,需要具体代码示例在编程中,循环结构是经常使用的一种重要语法。然而,在特定的情况下,我们可能希望在循环体内满足某个条件时,跳出整个循环,而不是仅仅终止当前的循环迭代。在这个时候,lambda表达式的特性可以帮助我们实现跳出循环的目标。lambda表达式是一种匿名函数的声明方式,它可以在内部定义简单的函数逻辑。它与普通的函数声明不同,

这篇文章将为大家详细讲解有关PHP返回数组所有值,组成一个数组,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。使用array_values()函数array_values()函数返回一个数组中所有值的数组。它不会保留原始数组的键。$array=["foo"=>"bar","baz"=>"qux"];$values=array_values($array);//$values将是["bar","qux"]使用循环可以使用循环手动获取数组的所有值并将其添加到一个新
