直接上干货

<html>

    <head>

        <title>Banner Cycler</title>

        <script>

            var banners = ["001.jpg","002.jpg","003.jpg"]; // 图片地址

            var counter = 0;

            function run(){

                setInterval(cycle,1000);  //重复运行cycle函数，周期100ms

            }

            function cycle(){

                counter++;

                if(counter == banners.length)

                    counter = 0;

                document.getElementById("banner").src = banners[counter];

            }

        </script>

    </head>

    <body onload = "run();">

        <img id="banner" alt="banner" src="001.jpg">

    </body>

</html>

JavaScript实现的图片循环播放的更多相关文章

  1. 特殊例子--JavaScript代码实现图片循环滚动效果

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. php广告图片循环播放 幻灯片效果

    <!DOCTYPE> <html> <head> <meta http-equiv="content-type" content=&quo ...

  3. js实现网页上图片循环播放

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/T ...

  4. iOS 用Swipe手势和动画实现循环播放图片

    主要想法 添加3个ImageView展示图片,实现图片的无限循环. 使用Swipe手势识别用户向右或向左滑动图片. 使用CATransition给ImageView.layer添加动画,展示图片更换的 ...

  5. winfrom 循环播放图片

    没啥新东西了,就是遍历和匹配文件名然后获取对象,放到picturebox里面 选中listview中想要查看的图片,然后点击查看按钮,进行↓代码. if (listView1.SelectedItem ...

  6. 使用javascript实现图片上下切换效果并且实现顺序循环播放

    <!doctype html><html lang="en"><head> <meta charset="UTF-8" ...

  7. JS可控制的图片自动循环播放查看效果

    JS可控制的图片自动循环播放查看效果 <html> <head> <title>JS可控制的图片自动循环播放查看效果丨芯晴网页特效丨CsrCode.Cn</t ...

  8. JavaScript中让Html页面中循环播放文字

    JavaScript中让Html页面中循环播放文字 <html> <head> <meta http-equiv="Content-Type" con ...

  9. 在WPF中显示GIF图片并实现循环播放

    WPF中有一个MediaElement媒体控件,可以来播放媒体,同时也可以显示GIF图片.但看到网上有些人说用MediaElement不能加载作为资源或内嵌的资源的GIF图片,我猜他们一定是在前台用X ...

随机推荐

  1. C学习笔记（3）---作用域，数组, （少量指针入门）

    1. 作用域(scope):任何一种编程中,作用域是程序中定义的变量所存在的区域,超过该区域变量就不能被访问.C 语言中有三个地方可以声明变量. a. 在函数或块内部的局部变量 - 在某个函数或块的内 ...

  2. (七)Amazon Lightsail 部署LAMP应用程序之清除已安装服务

    1.删除Lightsail实例 2.删除MySQL数据库 3.删除Amazon RDS数据库 4.删除负载均衡器 5.删除EC2实例 6.删除EC2安全组 7.删除快照

  3. 15.Java基础_初探对象

    package pack1; public class Phone { //成员变量 String brand; int price; //成员方法 public void call(){ Syste ...

  4. 标签中href="javascript:;"表示什么意思？

    1.标签的 href 属性用于指定超链接目标的 URL,href 属性的值可以是任何有效文档的相对或绝对 URL,包括片段标识符和 JavaScript 代码段. 2.javascript: 是一个伪 ...

  5. 设置了相对定位relative之后，改变top值，如何去掉多余空白？

    众所周知,relative和absolute有一个区别在于relative是相对自身定位,而absolute是相对于最近的定位父级定位,而此时的相对定位经过top值改变其在文档流中的位置之后,自身本来 ...

  6. 7. Vue - 组件

    一.组件分类 1. 定义 ​ 组件是可以扩展HTML元素,封装可重用的代码.在较高层面上,组件是自定义元素.特点为:代码重用,提高开发效率,让网页结构更清晰. 2. 局部组件 ​ 只能在定义它的el中 ...

  7. sudo apt-get 与 yum 常用命令

    yum -RedHat:CentOS... -xxx.rpmsudo apt-get  -Debian:Ubuntu...   -xxx.deb 安装工具rpm -ivh yum-2.0.4-1.rh ...

  8. Dockerfil

    Dockerfile简介 dockerfile 是一个文本格式的配置文件, 用户可以使用 Dockerfile 来快速创建自定义的镜像,另外,使用Dockerfile去构建镜像好比使用pom去构建ma ...

  9. C# 原子操作理解

    C#内置提供的原子操作 Interlocked.Increment:以原子操作的形式递增指定变量的值并存储结果. Interlocked.Decrement:以原子操作的形式递减指定变量的值并存储结果 ...

  10. HttpUtility.HtmlDecode ，HttpUtility.HtmlEncode 与 Server.HtmlDecode ，Server.HtmlEncode 与 HttpServerUtility.HtmlDecode ， HttpServerUtility.HtmlEncode

    HtmlEncode: 将 Html 源文件中不允许出现的字符进行编码,通常是编码以下字符"<".">"."&" 等. ...