<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
.banner{
width: 650px;
height: 130px;
position: relative;
}
.btn{
position: absolute;
bottom: 10px;
right: 10px;
}
.btn span{
display: inline-block;
color: red;
width: 20px;
text-align: center;
margin-right: 5px;
border: #FFF solid 2px;
}
</style>
<script type="text/javascript">
window.onload = function(){
var arr = new Array;
arr[0] = "http://pic2.ooopic.com/10/93/86/00b1OOOPIC79.jpg";
arr[1] = "http://pic2.ooopic.com/10/59/05/79b1OOOPICde.jpg";
arr[2] = "http://pic2.ooopic.com/10/58/57/39b1OOOPIC96.jpg";
var cont = 0;
function palys(){
if (arr.length == cont)
cont = 0;
document.getElementById("banner").src = arr[cont];
cont++;
}
var times = setInterval(palys,2000);
function cleartimes(){
clearInterval(times);
}
function show(num){
cleartimes();
var index = parseInt(num);
document.getElementById("banner").src = arr[index - 1];
cont = index;
}
}
</script>
</head>
<body>
<div>
<img src="http://pic2.ooopic.com/10/93/86/00b1OOOPIC79.jpg" width="650;" height="130" id="banner" />
<div>
<span onmouseover="show(1)">1</span>
<span onmouseover="show(2)">2</span>
<span onmouseover="show(3)">3</span>
</div>
</div>
</body>
</html>
添加回答
举报
0/150
提交
取消