js中控制图片的循环播放
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript">
function testbtu1(){
document.getElementById("image").src="../images/img/igloo-800_1x.jpg";
};
function testbtu2() {
document.getElementById("image").src="../images/img/render1_1x.jpg";
};
function testbtu3() {
document.getElementById("image").src="../images/img/space_1x.jpg";
};
function testbtu4() {
document.getElementById("image").src="../images/img/trees_1x.jpg";
};
var s=new Array("../images/img/igloo-800_1x.jpg","../images/img/render1_1x.jpg","../images/img/space_1x.jpg","../images/img/trees_1x.jpg");
var index=0;
function xunhuan() {
         imageCanvas = document.getElementById('image');
         imageCanvas.src=s[index];
         if(index >=4)
          {index=0;}
          else
           {index++;}
if(index!=0){
             window.setTimeout(xunhuan,3000); 
}
else{
window.setTimeout(xunhuan,0)}
}

</script>
<style type="text/css">
#but1 {
position: absolute;
left: 250px;
top: 280px;
}
#but2 {
position: absolute;
left: 290px;
top: 280px;
}
#but3 {
position: absolute;
left: 330px;
top: 280px;
}
#but4 {
position: absolute;
left: 370px;
top: 280px;
}
</style>
</head>
<body onLoad="xunhuan();">
<img src="../images/img/igloo-800_1x.jpg" alt="" id="image">
<input type="button" value="1" id="but1" onclick="testbtu1();">
<input type="button" value="2" id="but2" onclick="testbtu2();">
<input type="button" value="3" id="but3" onclick="testbtu3();">
<input type="button" value="4" id="but4" onclick="testbtu4();">
</body>
</html>
阅读更多
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/qq_29377109/article/details/51542828
想对作者说点什么? 我来说一句

图片循环自动播放js

2017年10月23日 1KB 下载

图片循环播放.rar

2009年08月24日 97KB 下载

没有更多推荐了,返回首页

不良信息举报

js中控制图片的循环播放

最多只允许输入30个字

加入CSDN,享受更精准的内容推荐,与500万程序员共同成长!
关闭
关闭