这篇文章主要介绍怎么使用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); //设置定时器
以上是“怎么使用js实现图片轮播效果”这篇文章的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注亿速云行业资讯频道!
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。