JavaScript实现轮播图(隔3秒显示一张图)
<!DOCTYPE html>
<html>
<head>
<script>
var time;
function init(){
//获取div里面的东西
time=setInterval("show()",3000);
setInterval("show1()",3000);
}
var num=1;
function show1(){
if(num>3){
num=1;
}
var imageObj=document.getElementById("divshow1");
imageObj.src="img/"+ num++ +".jpg";
}
function show(){
var divshow = document.getElementById("divshow");
divshow.style.display="none";
clearInterval(time);
time =setInterval("hidden()",3000)
}
function hidden(){
var divshow=document.getElementById("divshow");
divshow.style.display="block";
clearInterval(time);
time =setInterval("show()",1000)
}
</script>
</head>
<body onload="init()">
<div id="divshow" style="width: 99%; display: block;"><img src="img/1.jpg" width="100%" id="divshow1"/></div>
</body>
</html>
JavaScript实现轮播图(隔3秒显示一张图)的更多相关文章
- Vue-Awesome-Swiper实现缩略图控制循环,循环背景图,显示多图轮播,点击左右滚动一张图
效果图: 本姐只展示关键代码哈 上代码:网站有完整代码,但是数据不是循环的.https://surmon-china.github.io/vue-awesome-swiper/ 循环数据的代码在此: ...
- JavaScript焦点轮播图
在慕课学习了JavaScript焦点轮播图特效,在此做一个整理. 首先是html结构,我用的是本地同文件夹下的三张图片,多出来的第一张(pic3副本)和最后一张图片(pic1副本)是为了实现无缝切换效 ...
- HTML+CSS+Javascript实现轮播图效果
HTML+CSS+Javascript实现轮播图效果 注意:根据自己图片大小来更改轮播图大小. <!doctype html> <html> <head> < ...
- JavaScript banner轮播 左右切换 圆点点击切换
1.效果如下图: 2.源码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charse ...
- 第一百五十五节,封装库--JavaScript,轮播器
封装库--JavaScript,轮播器 html <div id="banner"> <img src="img/banner1.jpg" a ...
- UIScrollerView当前显示3张图
代码地址如下:http://www.demodashi.com/demo/11173.html WSLScrollView 功能描述:这是在继承UIView的基础上利用UIScrollerView进行 ...
- javascript简单轮播图
**轮播图实现原理: 通过多张图片平铺,用overflow:hidden只显示一张图片.其他的隐藏,无缝滚动用定时器改变元素的left值让图片呈现左右滚动的效果.** HTML布局和内容: 1.容器c ...
- 原生javascript焦点轮播图
刚刚学会,写了一个轮播图效果,不过bug蛮多,请高手指点一下,谢谢 <!DOCTYPE html> <html> <head> <meta charset=& ...
- JavaScript实现轮播图效果
我又来了,同志们.老想你们了 捕获小可爱一枚. 下面进入正题:用JavaScript原生代码写轮播图效果. 具体效果就不多说了,网站上面的轮播效果我们都知晓.下面是展示代码 html代码: <d ...
随机推荐
- JAVA NIO之文件通道
1.简介 通道是 Java NIO 的核心内容之一,在使用上,通道需和缓存类(ByteBuffer)配合完成读写等操作.与传统的流式 IO 中数据单向流动不同,通道中的数据可以双向流动.通道既可以读, ...
- poj 3620
题意:给出一个矩阵,其中有些格子干燥.有些潮湿. 如果一个潮湿的格子的相邻的四个方向有格子也是潮湿的,那么它们就可以构成更大 的湖泊,求最大的湖泊. 也就是求出最大的连在一块儿的潮湿的格子的数目. # ...
- Kafka OffsetMonitor:监控消费者和延迟的队列
一个小应用程序来监视kafka消费者的进度和它们的延迟的队列. KafkaOffsetMonitor是用来实时监控Kafka集群中的consumer以及在队列中的位置(偏移量). 你可以查看当前的消费 ...
- Jenkins + Docker 持续集成
Jenkins介绍 Jenkins是一个开源软件项目,是基于Java开发的一种持续集成工具,用于监控持续重复的工作,旨在提供一个开放易用的软件平台,使软件的持续集成变成可能. 安装部署Jenkins ...
- robotframework环境搭建问题
启动的时候报错,应该是环境变量没有配置好 错误: command: pybot.bat --argumentfile c:\users\keikei\appdata\local\temp\RIDEam ...
- New UWP Community Toolkit - Staggered panel
概述 前面 New UWP Community Toolkit 文章中,我们对 2.2.0 版本的重要更新做了简单回顾,其中简单介绍了 Staggered panel,本篇我们结合代码详细讲解 St ...
- 位图(BitMap)
位图 引入:2.给40亿个不重复的无符号整数,没排过序.给一个无符号整数,如何快速判断一个数是否在这40亿个数中. [腾讯] 思路:如果内存够的话,40亿个整型使用位图存储需要500M左右的空间. 分 ...
- Linux下ip配置与网络重启
ip配置 //以下ip配置重启失效 sudo ifconfig 192.168.1.1 sudo ifconfig 192.168.1.1 netmask 255.255.255.0 网络重启 //关 ...
- Python IDE Spyder的简单介绍
最近深度学习发展非常迅猛,大有一统江湖的趋势.经过一段时间学习,发现自己对这种神奇的玄学非常感兴趣,希望能够进一步的研究.而这种研究性学科单纯地看论文比较难以明白,所以希望能够跟进大牛们写的代码深入学 ...
- 小草手把手教你 LabVIEW 串口仪器控制——初识VISA串口
有些人,学习一样东西时候,喜欢现成的例子.很多人学习一门技术,都喜欢现成的例子开始,比如学单片机的啊,最开始都是修改的例子吧,学语言的也是.最开始都是模仿.这个年头看书上的理论知识太浪费时间了.所以啊 ...