码迷,mamicode.com
首页 > 编程语言 > 详细

利用数组实现几张图片循环显示

时间:2015-04-12 19:14:32      阅读:130      评论:0      收藏:0      [点我收藏+]

标签:

2015-04-12 17:40:22

利用数组实现图片循环就是将图片放在数组中,然后循环显示

以四张图片为例

<script>
  //利用数组对象实现四张图片每隔5秒换一张的效果
	var img=new Array();//创建数组对象
	var index=0;//定义数组下标
	img[0]=new Image();
	img[0].src=‘../../../imgs/66.ico‘;
	img[1]=new Image();
	img[1].src=‘../../../imgs/68.ico‘;
	img[2]=new Image();
	img[2].src=‘../../../imgs/70.ico‘;
	function changePIC(){
		document.images[0].src=img[index].src;
		index++;
		if(index==3){
			index=0;
		}
	}
	setInterval(‘changePIC();‘,5000);
  </script>
 </head>
 <body>
  <img src="../../../imgs/64.ico" />
 </body>

  我用的图是图标

  Image():预装载图片对象

第二种方法:

<script>	
  	var t=1;
  	function changePic(){
	if(t==1){
	document.images[0].src=‘2.jpg‘;
	t=2;
	}else if(t==2){
	document.images[0].src=‘3.jpg‘;
	t=3;
	}else{
	document.images[0].src=‘4.jpg‘;
	t=1;
	}
  
 	 }
  	window.setInterval(‘changePic()‘,5000);
  	</script>
 	</head>
 	<body>
  	<img name=‘im1‘ src=‘1.jpg‘ />
 	</body>

  

 

利用数组实现几张图片循环显示

标签:

原文地址:http://www.cnblogs.com/xiaotudou-datudou/p/4419974.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!