<style type="text/css">
#datu
{
width:500px;
height:400px;
position:relative;
margin:auto;
top:100px;
border:2px solid #309;
overflow:hidden;
}
#xiao
{
width:50px;
height:100px;
position:absolute;
left:0px;
top:200px;
z-index:;
text-align:center; line-height:100px; font-size:100px;
cursor:pointer;
}
#xiao1
{
width:50px;
height:100px;
position:absolute;
right:0px;
top:200px;
z-index:;
text-align:center; line-height:100px; font-size:100px;
cursor:pointer;
}
#ta
{
position:relative;
left:0px;
top:0px;
transition:0.7s;}
</style>
<body>
<div id="datu" onmouseover="Zhi()" onmouseout="Li()" onclick="Chang()">
<table id="ta" cellpadding="0" cellspacing="0">
<tr height="400">
<td width="500px"><img src="../Documents/未命名站点 2/1.jpg" width="500" /></td>
<td><img src="../Documents/未命名站点 2/2.jpg" height="400" width="500"/></td>
<td><img src="../Documents/未命名站点 2/3.jpg" height="400" width="500"/></td>
<td><img src="../Documents/未命名站点 2/5.jpg" height="400" width="500"/></td>
<td><img src="../Documents/未命名站点 2/800.jpg" height="400" width="500"/></td>
<div id="xiao" onclick="zuo()">«</div>
<div id="xiao1" onclick="you()">»</div>
</tr>
</table>
</div>
</body>
</html>
<script>
document.getElementById("ta").style.left="0px";
function Change()
{
var ta = parseInt(document.getElementById("ta").style.left);
if(ta>-2000)
{
document.getElementById("ta").style.left=(ta-500)+"px";
ta=ta-500;
}
else
{
document.getElementById("ta").style.left="0px";
}
shi=window.setTimeout("Change()",3000);
}
var shi =window.setTimeout("Change()",3000);
function Zhi()
{
window.clearTimeout(shi);
}
function Li()
{
shi=window.setTimeout("Change()",1000);
}
function zuo()
{
var ta = parseInt(document.getElementById("ta").style.left);
if(ta<0)
{
document.getElementById("ta").style.left=(ta+500)+"px";
ta=ta+500;
}
else
{
document.getElementById("ta").style.left="-2000px";
}
}
function you()
{
var ta = parseInt(document.getElementById("ta").style.left);
if(ta>-2000)
{
document.getElementById("ta").style.left=(ta-500)+"px";
ta=ta-500;
}
else
{
document.getElementById("ta").style.left="0px";
}
}
</script>
