首页 > 代码库 > js 随机变换图片

js 随机变换图片

 

 1       <div style="position:absolute;left:40%;top:10%;border-style:dotted">
 2           <img src="http://www.mamicode.com/ejb.jpg"/><br/>
 3           <input type="button" value="http://www.mamicode.com/随机选择人物"/>
 4           <input type="button" value="http://www.mamicode.com/暂停"/>
 5       </div>
 6       <script type="text/javascript">
 7          //创建一个数组
 8          var paths = new Array();
 9           var isExecute = true;
10           var count=0;
11           window.onload = function(){
12               //将N张图片的路径放入数组中
13               paths[0]="ejb.jpg";
14               paths[1]="j2ee.jpg";
15               paths[2]="java.gif";
16               paths[3]="javamail.gif";
17           }
18           //随机选择人物
19           document.getElementsByTagName("input")[0].onclick=function(){
20               window.setInterval("changeImage()",500);
21               isExecute=true;
22           }    
23           //换图片
24           function changeImage(){
25               if(isExecute){
26                   //随机选取一张图片
27                   var path = getPath();
28                   //动态修改图片的src属性值
29                   var imgElement = document.images[0];
30                   imgElement.src =http://www.mamicode.com/ path;
31               }
32           }
33           //随机选中一张图片的路径
34           function getPath(){
35               //随机获取0,1,2中的任何一个型值
36               var index = Math.floor(Math.random()*4);
37               count=count+1>3?0:count+1;
38               return paths[count];
39               //return paths[index];
40           }
41           //暂停
42           document.getElementsByTagName("input")[1].onclick=function(){
43               isExecute = false;
44           }
45       </script>