首页 > 代码库 > 非常简单的js切换效果(具有举一反三效果)
非常简单的js切换效果(具有举一反三效果)
今天无意中在网上发现的,代码非常的简单,一看就明白的js图片切换效果代码,喜欢简洁的朋友可以参考一下。
html:
1 <img src="a1.jpg" width="478" height="286" id="showpic" />
图片可以自己设置的,下面我们来看下切换脚本,利用数组把图片装起来。
1 <script type="text/javascript"> 2 window.onload = function(){ 3 var curIndex = 0; 4 var timerInterval = 2000; //时间间隔 单位毫秒 5 var arr = new Array(); 6 arr[0] = "a1.jpg"; 7 arr[1] = "a2.jpg"; 8 arr[2] = "a3.jpg"; 9 arr[3] = "a4.jpg";10 arr[4] = "a5.jpg";11 arr[5] = "a6.jpg";12 arr[6] = "a6.jpg";13 setInterval(changeImg,timerInterval);14 function changeImg(){15 var obj = document.getElementById(‘showpic‘);16 if(curIndex == arr.length - 1){17 curIndex = 0;18 }else{19 curIndex += 1;20 }21 obj.src = arr[curIndex];22 }23 }24 </script>
这段代码,简单但很巧妙。
经过测试,完全可以实现自动切换。
非常简单的js切换效果(具有举一反三效果)
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。