使用JS制作简单的轮播图
- 利用了setInterval的滚动性,也可以用while+setTimeout替代。
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<title>Java Script Test Place</title>
</head>
<body>
<img id="img" src="WEB-INF/images/one.jpg" width="100%">
<script>
var img=document.getElementById("img");
var cnt=0;
setInterval(fun, 2*1000);
function fun(){
switch (cnt) {
case 0:
img.src="WEB-INF/images/one.jpg";
cnt=(cnt+1)%3;
break;
case 1:
img.src="WEB-INF/images/two.jpg";
cnt=(cnt+1)%3;
break;
case 2:
img.src="WEB-INF/images/three.jpg";
cnt=(cnt+1)%3;
break;
default:
document.write("<h1>Wrong...</h1>");
break;
}
}
</script>
</body>
</html>