代码：

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title></title>

    <script>

        var index = 0;

        function changeImg() {

            // 获得要切换图片的那个元素

            var img = document.getElementById("img1");

            //计算出当前要切换到第几张图片

            var curIndex = index % 3 + 1;  //0,1,2

            img.src = "img/" + curIndex + ".jpg";  //1,2,3

            //每切换完,索引加1

            index = index + 1;

        }

        function init() {

            setInterval("changeImg()", 3000);

        }

    </script>

</head>

<body onload="init()">

    <img src="img/1.jpg" width="1920" id="img1"/>

</body>

</html>

JS练习：替换式图片自动轮播的更多相关文章

  1. 2017年10月21日 CSS常用样式&鼠标样式 以及 jQuery鼠标事件& jQuery图片轮播& jQuery图片自动轮播代码

    css代码 背景与前景 background-color:#0000; //背景色,样式表优先级高 background-image:url(路径); //设置背景图片 background-atta ...

  2. AJ学IOS（11）UI之图片自动轮播

    AJ分享,必须精品 先看效果 代码 #import "NYViewController.h" #define kImageCount 5 @interface NYViewCont ...

  3. 仿网易新闻 ViewPager 实现图片自动轮播

    新闻 App 首页最上方一般会循环播放热点图片,如下图所示. 本文主要介绍了利用 ViewPager 实现轮播图片,图片下方加上小圆点指示器标记当前位置,并利用 Timer+Handler 实现了自动 ...

  4. ios - 图片自动轮播定时器(NSTimer)以及消息循环模式简介

    本文只是演示如何设置图片轮播的定时器. 创建全局变量NSTimer 程序启动后就开始轮播图片,所以在- (void)viewDidLoad中就启动定时器. 将定时器放入消息循环池中.- (void)v ...

  5. js和jquery实现图片无缝轮播的不同写法

    多掌握一种方法总是会有好处的,学习编程就要多思考,举一反三 下面写一下实现图片自动播放的代码,由于学习的是javascript,代码量很大,所以又学习了jquery库的操作,非常简便 还有非常有逼格的 ...

  6. 原生javascript实现图片自动轮播和点击轮播代码

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. 用jquery写出图片自动轮播效果

    相关代码如下,只要把代码粘贴进编辑器,修改图片路径,即可看到效果. 1.html部分 <body>   <ul class="banner">   < ...

  8. Viewpager图片自动轮播，网络图片加载，图片自动刷新

    package com.teffy.viewpager; import java.util.ArrayList; import java.util.concurrent.Executors; impo ...

  9. Wpf实现图片自动轮播自定义控件

    近来,公司项目需要,需要写一个自定义控件,然后就有下面的控件产生.样式没有定义好,基本功能已经实现.1.创建为自定义控件的XAML页面.下面为后台代码 using System; using Syst ...

随机推荐

  1. express的路由

    就是 app.get().app.post().app.all()啦,啦啦啦 (其中,var express = require("express"); var app = exp ...

  2. Java之正則表達式【使用语法】

    认为好就顶一个!! ! ! 3.正則表達式 用一些特殊的有意义的字符组成的字符串(死记) 原子:正則表達式的最基本组成单位 正則表達式特殊意义的字符:   .  *  +  ?不能单独表示它们,假设非 ...

  3. Codesys——PLCopen基本运动控制功能块的使用方法总结

    MC_Halt 在MC_MoveVelocity模式下,用MC_Halt停止其轴,当前轴的状态由 ContinuousMotion(当前转速)--->DiscreteMotion(速度不为0)- ...

  4. 深度学习的seq2seq模型——本质是LSTM，训练过程是使得所有样本的p(y1,...,yT‘|x1,...,xT)概率之和最大

    from:https://baijiahao.baidu.com/s?id=1584177164196579663&wfr=spider&for=pc seq2seq模型是以编码(En ...

  5. 04、抽取BaseActivity

    // 在使用SDK各组件之前初始化context信息,传入ApplicationContext // 注意该方法要再setContentView方法之前实现 // SDKInitializer.ini ...

  6. 自动调整速率的Actor设计模式

    问题背景 与数据库或者存储系统交互是所有应用软件都必不可少的功能之一,akka开发的系统也不例外.但akka特殊的地方在于,会尽可能的将所有的功能都设计成异步的,以避免Actor阻塞,然而无法避免IO ...

  7. Java使用Player播放mp3

    大家平时闲了都会听听歌,散散心,于是很多人就问,在Java里边如何播放歌曲呢,唉,别说,在Java里边还真能歌曲,下面我为大家揭晓. 我们都知道Java里边做什么都需要对应的jar包,首先贴上mave ...

  8. Java初级进阶中高级工程师必备技能

    很多人学了javase以为自己学的已经很OK了,但是其实javase里边有很多的知识点是你不知道的,不管你找的是哪里的javase的视频,大多数是不会讲这些东西,而这些东西你平时业务又不会主动去接触, ...

  9. strupr函数

    2019-06-03 15:13:39 strupr()函数! strupr,函数的一种,将字符串s转换为大写形式. 说明:只转换s中出现的小写字母,不改变其它字符.返回指向s的指针. 兼容性说明:s ...

  10. yield from （python生成器）

    #生成器中的yield from是干什么用的(一般多用于线程,协程那)def func(): # for i in 'AB': # yield i yield from 'AB' # 就相当于上面的f ...