鼠标单击切换图片
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了鼠标单击切换图片相关的知识,希望对你有一定的参考价值。
<style>
body{background:#000000;text-align:center;}
h1{margin:40px;color:#FFFFFF;font-weight:bold;}
hr{color:#FFFFFF;margin:20px;}
#Bos{width:500px;height:200px;margin:100px auto;}
</style>
<script>
window.onload=function()
{
var curIndex=0;
var arr=new Array();
arr[0]="img_1.jpg";
arr[1]="img_2.jpg";
arr[2]="img_3.jpg";
var img=document.getElementById(‘img‘);
img.onclick=function(){
if(curIndex==arr.length-1)
{
curIndex=0;
}
else
{
curIndex+=1;
}
img.src=arr[curIndex];
}
}
</script>
<body>
<h1>图片自动切换</h1>
<hr />
<div id="Bos">
<img src="img_1.jpg" id="img" style="width:500px;height:200px;"/>
</div>
</body>
以上是关于鼠标单击切换图片的主要内容,如果未能解决你的问题,请参考以下文章