一个简易的js图片轮播效果
更新时间：2017年07月22日 09:03:56 作者：mercuryTan
这篇文章主要为大家详细介绍了一个简易的js图片轮播效果，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
一个简易的js图片轮播效果，话不多说，代码献上.
只有img标签的html代码，做测试用：
<body> <img src="images/class1-1.jpg" id="img"> </body>
下面是js代码:
var k=0; //当前的索引
var ss = new Array(); //数组，用来存放图片
ss[0] = "images/class1-1.jpg";
ss[1] = "images/class1-2.jpg";
ss[2] = "images/class1-3.jpg";
ss[3] = "images/class1-4.jpg";
function scrollPic(){
if(k>ss.length-1){ //如果当前函数超过数组下标的最大值，k=0
k=0;
}
for(var i=0;i<ss.length;i++){ //遍历数组
if(i==k){ //如果当前索引等于当前数组下标
document.getElementById("img").src=ss[i]; //改变图片路径
}
}
k++; //k++,执行下一次操作
}
setInterval("scrollPic()",1000); //设置定时器
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。
相关文章
要掌握好 JavaScript，首先一点是必须摒弃一些其他高级语言如 Java、C# 等类式面向对象思维的干扰，全面地从函数式语言的角度理解 JavaScript 原型式面向对象的特点2013-11-11
详解JS鼠标事件中clientX/screenX/offsetX/pageX属性的区别
在熟悉业务中播放器功能的时候,发现时间轴上绑定了点击和拖动事件,频繁遇到了类似pageX之类的事件属性,所以本文就来和大家详细聊聊clientX/screenX/offsetX/pageX等属性的区别吧2024-03-03
这篇文章主要介绍了如何在postman中添加cookie信息,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下2020-06-06
图片下载是前端常见的需求，如果一张一张下载未免太影响体验了，于是写下了这个多张图片打包成zip的demo2021-05-05
本文详细介绍下，如何动态加载外部js文件及js；动态加载外部css样式及css样式，感兴趣的朋友可以参考下哈，希望对你学习js有所帮助2013-04-04
一个级联菜单代码学习及removeClass与addClass的应用
最近在学些web前段的知识，看见博客园首页左侧的一个级联菜单,很是好奇，于是想自己实现以下，代码书写很简洁而且易懂，感兴趣的朋友可以了解下，希望本文对你学习级联菜单有所帮助2013-01-01
这篇文章主要为大家介绍了简单易懂的JSONP和CORS跨域方案详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2022-10-10
JavaScript继承基础讲解(原型链、借用构造函数、混合模式、原型式继承、寄生式继承、寄生组合式继承)
这篇文章主要介绍了JavaScript继承基础讲解，原型链、借用构造函数、混合模式、原型式继承、寄生式继承、寄生组合式继承,需要的朋友可以参考下2014-08-08
今天小编就为大家分享一篇解决layui 复选框等内置控件不显示的问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-08-08
这篇文章主要介绍了JS封装的选项卡TAB切换效果,结合实例形式分析了javascript响应鼠标事件动态操作页面元素属性实现tab切换的相关技巧,需要的朋友可以参考下2016-09-09
最新评论