直接复制下来,打开看看,记得在images文件夹方4张图片
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
#div_adv{ width:720px; height:203px;}
#imgsdiv{ width:720px; height:203px; border:1px solid #C00;z-index:1;}
.ulinput{ list-style:none; width:80px; height:25px; padding:0px; margin:0px;
position:absolute; top:190px; left:330px; z-index:2;}
.ulinput li{ float:left; margin-left:5px; }
.ulinput li input{ width:15px; height:15px; border:1px solid #666; color:#666; margin:0px; padding:0px;}
</style>
<script type="text/javascript">
function $(divs){return document.getElementById(divs);}
function lunbo(maji){
var imgs = $("imgs");
switch(maji){
case "1":
imgs.setAttribute("src","images/lunbo1.jpg");
break;
case "2":
imgs.setAttribute("src","images/lunbo2.jpg");
break;
case "3":
imgs.setAttribute("src","images/lunbo3.jpg");
break;
case "4":
imgs.setAttribute("src","images/lunbo4.jpg");
break;
default:
imgs.setAttribute("src","images/lunbo1.jpg");
break;
}
init();
}
var setInte;
function gos(){
init();
var imgs = $("imgs");
for(var i=1; i<=4;i++){
if(i==4){
imgs.setAttribute("src","images/lunbo1.jpg");
break;
}
if(imgs.src.indexOf(i)>-1){
var srcurl="images/lunbo"+(i+1)+".jpg";
imgs.setAttribute("src",srcurl);
break;
}
}
}
function stopdiv(){
clearInterval(setInte);
}
function init(){
clearInterval(setInte);
setInte = setInterval("gos()","3000");
}
window.οnlοad=init;
</script>
</head>
<body>
<div id="div_adv">
<div id="imgsdiv" οnmοusemοve="stopdiv()" οnmοuseοut="init()">
<img src="images/lunbo1.jpg" alt="广告" id="imgs" />
</div>
<ul class="ulinput">
<li><input type="button" value="1" name="btnimg" οnclick="lunbo('1')" οnmοusemοve="lunbo('1')"/></li>
<li><input type="button" value="2" name="btnimg" οnclick="lunbo('2')" οnmοusemοve="lunbo('2')"/></li>
<li><input type="button" value="3" name="btnimg" οnclick="lunbo('3')" οnmοusemοve="lunbo('3')"/></li>
<li><input type="button" value="4" name="btnimg" οnclick="lunbo('4')" οnmοusemοve="lunbo('4')"/></li>
</ul>
</div>
</body>
</html>