<!DOCTYPE html>
<html>
<head>
<script >
var time;
function init(){
//设置定时操作
time=setInterval("show()",0);
//3秒执行一次
setInterval("show1()",1000);
}
var num=1;
function show1(){
if(num>4){
num=1;
}
var imageObj=document.getElementById("divshow1");
imageObj.src="img/"+ num++ +".jpg";
}
function show(){
//获得div元素
var divshow = document.getElementById("divshow");
divshow.style.display="block";
//清除之前的定时操作
//clearInterval(time);
//重新设置一个定时，3秒钟隐藏
//time=setInterval("hidden()",1000);
}
/*function hidden(){
var divshow=document.getElementById("divshow");
divshow.style.display="none";
clearInterval(time);
time=setInterval("show()",1000);
}*/
</script>
</head>
<body onload="init()">
<div id="divshow" style="width: 99%; display: none;">
<img src="img/1.jpg" width="100%" id="divshow1"/>
</div>
</body>
</html>

JavaScript实现图片轮播图的更多相关文章

  1. 图片轮播图插件的使用 unslider！！！

    1.百度图片轮播图unslider,第一个就会出现jquery unslider轮播图,点击进去,下载网站提供的文件,解压,内部有我们需要使用的各种js,图片等. 2.在自己的eclipse或者int ...

  2. iOS 图片轮播图（自动滚动）

    iOS 图片轮播图(自动滚动) #import "DDViewController.h" #define DDImageCount 5 @interface DDViewContr ...

  3. javascript原生js轮播图

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

  4. 用JavaScript制作banner轮播图

    JavaScript_banner轮播图 让我们一起来学习一下用js怎么实现banner轮播图呢? 直接看代码: <!DOCTYPE html> <html> <head ...

  5. JavaScript实现动态轮播图效果

    功能描述: 1.鼠标经过 左右侧箭头显示,鼠标离开 箭头隐藏 2.动态添加底部小圆圈并绑定单击事件,并且让小圆圈的点击事件和左右箭头点击事件同步 3.拷贝第一张图片添加到ul最后可以实现动态添加图片 ...

  6. Web前端原生JavaScript浅谈轮播图

    1.一直来说轮播图都是困扰刚进业内小白的一大难点,因为我们不仅需要自己作出一个比较完美的运动框架(虽然网上一抓一大把,但是哪有比自己做出来实现的有成就感,不是吗?^_^),还必须需要非常关键性的把握住 ...

  7. BannerDemo【图片轮播图控件】

    版权声明:本文为HaiyuKing原创文章,转载请注明出处! 前言 这里简单记录下一个开源库youth5201314/banner的运用.具体用法请阅读<youth5201314/banner& ...

  8. 从零开始学习前端JAVASCRIPT — 11、JavaScript运动模型及轮播图效果、放大镜效果、自适应瀑布流

    未完待续...... 一.运动原理 通过连续不断的改变物体的位置,而发生移动变化. 使用setInterval实现. 匀速运动:速度值一直保持不变. 多物体同时运动:将定时器绑设置为对象的一个属性. ...

  9. javascript 实现图片轮播和点击切换功能

    图片轮播是网页上一个比较常见的功能,下面我们来实现他吧 原理很简单: 1:固定的区域,所有的图片重叠,一次只能显示一张图片 2:通过改变图片的zIndex属性改变显示的图片,就可以达到切换的效果了 & ...

随机推荐

  1. python之Redis的字符串类型操作

    redis的数据类型: 字符串型    哈希     列表     集合     有序集合 1.String(字符串类型) set  命令:   设置一个键和值,键存在则只覆盖,返回ok > s ...

  2. 【CSS】 CSS的一些应用实例和参考

    css 一些应用实例 基本抄自http://www.w3school.com.cn/css/css_align.asp ..把这些知识消化吸收然后以自己的话来解释一下 ■ 对齐 ●  用margin属 ...

  3. Notepad++使用vs2015主题教程

    前言: 最近几天都在用Notepad++,所以想换个看得舒服点的主题. 发现vs2015的主题颜色特别好看.所以就查了一下有没有大佬做了这样的Notepad++主题. 结果是有的. 正文: notep ...

  4. JavaScript(第五天)【流程控制语句】

    ECMA-262规定了一组流程控制语句.语句定义了ECMAScript中的主要语法,语句通常由一个或者多个关键字来完成给定的任务.诸如:判断.循环.退出等.   一．语句的定义   在ECMAScri ...

  5. Beta冲刺NO.6

    Beta冲刺 第六天 1. 昨天的困难 1.对于设计模式的应用不熟悉,所以在应用上出现了很大的困难. 2.SSH中数据库的管理是用HQL语句实现的,所以在多表查询时出现了很大的问题. 3.页面结构太凌 ...

  6. 团队作业9——事后分析（Beta版本）

    事后诸葛亮分析 1.         总结 团队合照   a. 项目管理之事后诸葛亮会 ·设想和目标 (1)我们的软件要解决什么问题?是否定义得很清楚?是否对典型用户和典型场景有清晰的描述? 个人学习 ...

  7. C语言——第一次作业(2)

    1.写程序证明p++等价于(p)++还是等价于*(p++)? #include <stdio.h> int main() { int *p,a=5; p = &a; printf( ...

  8. 201621123031 《Java程序设计》第14周学习总结

    1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结与数据库相关内容. 2. 使用数据库技术改造你的系统 2.1 简述如何使用数据库技术改造你的系统.要建立什么表?截图你的表设计. 答 ...

  9. hibernate懒加载导致jackjson解析json时StackOverFlow

    @JsonIgnore @JsonFilter @JsonBackReference @JsonManagedReference @JsonIgnoreProperties jackson中的@Jso ...

  10. 用js 获取url 参数 页面跳转 ？ 后的参数

    记得之前在原来的公司写过这个东西,但是还是忘记怎么接住参数了,只知道怎么把id传过去! 问了身边的大佬 他首先推荐了我一个链接是别人写好的方法 附上链接地址:http://blog.csdn.net/ ...