一个简易的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继承机制与simple-inheritance源码分析
Javascript语言对继承实现的并不好,需要工程师自己去实现一套完整的继承机制。下面我们由浅入深的系统掌握使用javascript继承的技巧,对javascript继承相关知识感兴趣的朋友一起看看吧2015-12-12
深入理解JavaScript系列(27):设计模式之建造者模式详解
这篇文章主要介绍了深入理解JavaScript系列(27):设计模式之建造者模式详解,建造者模式可以将一个复杂对象的构建与其表示相分离,使得同样的构建过程可以创建不同的表示,需要的朋友可以参考下2015-03-03
javascript event在FF和IE的兼容传参心得(绝对好用)
event在IE和FF不兼,下面为大家分享的是javascript event在FF和IE的兼容传参心得,需要的朋友可以参考下2014-07-07


最新评论