图片轮播没效果

图片轮播没效果

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Document</title>

<style type="text/css">

#d{

position: relative;

top:-10px;

}

label{

margin-left:20px;

}

</style>

</head>

<script type="text/javascript">

var n=0;

function init(){

n++;

if (n==7)

n=1;

var img=document.getElementById("img");

img.src=n+".jpg";

setTimeout("init()",1000); //设置轮播时间

}

</script>

<body>

<div>

<img src="1.jpg" width="300" height="300">

<div id="d">

<label> 1 </label>

<label> 2 </label>

<label> 3 </label>

<label> 4 </label>

<label> 5 </label>

<label> 6 </label>

<label> 7 </label>

</div>

</div>

</body>

</html>

qq_浅秋_04051456

浏览 1714回答 2

2回答

qq_冲哥_0

1，你在body的上面书写script 标签，也就是js代码，你没有window.onload, 根本获取不到 img图片。2，再者，你的img 没有id， getElementbyId() 也获取不到img 图片。3，你只写了一个init()函数，根本没有调用。4， setTimeout 最好接受一个函数作为第一个参数，这是最佳实践，不要传字符串<img src="1.jpg" width="300" height="300" id ='img'> <script type="text/javascript"> var n=0; var img=document.getElementById("img"); function init(){ n++; if (n==7) n=1; img.src="bg" + n+".jpg"; setTimeout(init,1000); //设置轮播时间 } init();

2

0

随时随地看视频慕课网APP

相关分类

JavaScript
WebApp
前端工具: 学籍认证信息有误为啥不能取消验证审核 1 回答