head里
<style>
*{ margin:50px auto;}
#tuijian{ 760px;
height:350px;
background-repeat:no-repeat;
background-position:center center;}
.pages{ top:200px;
background-color:black;
opacity:0.5;
30px;
height:60px;}
#p1{ float:left;
margin-left:10px;
margin-top:150px;}
#p2{ float:right;
margin-right:10px;
margin-top:150px;}
</style>
body里
<div id="tuijian" style="background-image:url(1.jpg);"> <div class="pages" id="p1" onclick="dod(-1)"></div> <div class="pages" id="p2" onclick="dod(1)"></div> </div>
html外
<script>
var jpg=new Array();
jpg[0]="url(1.jpg)";
jpg[1]="url(2.jpg)";
jpg[2]="url(3.jpg)";
var tjimg=document.getElementById("tuijian");
var xb=0;
var n=0;
function huan()
{
xb++;
if(xb==jpg.length)
{
xb=0;
}
tjimg.style.backgroundImage=jpg[xb];
if(n==0)
{
window.setTimeout("huan()",3000);
}
}
window.setTimeout("huan()",3000);
function dod(m)
{
xb=xb+m;
if(xb<0)
{
xb=jpg.length-1;
}
else if(xb>=jpg.length)
{
xb=0;
}
tjimg.style.backgroundImage=jpg[xb];
}
</script>
