`
太阳神喻
  • 浏览: 107331 次
  • 性别: Icon_minigender_1
  • 来自: 武汉
社区版块
存档分类
最新评论

图像自动切换

阅读更多
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>图像自动切换</title>
<script language =javascript > 
	var curIndex=0; 
	//时间间隔 单位毫秒 
	var timeInterval=1000; 
	var arr=new Array(); 
	arr[0]="img/01.jpg"; 
	arr[1]="img/02.jpg"; 
	arr[2]="img/03.jpg"; 
	arr[3]="img/04.jpg"; 
	arr[4]="img/05.jpg"; 
	arr[5]="img/06.jpg"; 
	arr[6]="img/07.jpg"; 
	//启动定时器
	setInterval(changeImg,timeInterval); 
	
	function changeImg() 
	{ 
		var myImg=document.getElementById("myImg"); //得到img标签
		var info = document.getElementById("info");//得到label标签
		if (curIndex==arr.length-1) 
		{ 
			curIndex=0; 
		} 
		else 
		{ 
			curIndex+=1; 
		} 
		myImg.src=arr[curIndex]; //
		info.innerText = "第"+curIndex+"张图像";//显示为当前的图像说明
	} 
</script>
</head>
<body>
    <center>
        <label id="info">图像</label><br />
        <img id="myImg" src ="img/01.jpg" border =0 width="500px" />
    </center>
</body>

 

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics