<!DOCTYPE?html>
<html>
<head>
<meta?charset="UTF-8">
<title></title>
<style>
*{?padding:?0px;?margin:?0px;}
ul{?list-style:?none;}
a{text-decoration:?none;}
.container{?width:?300px;?height:?200px;?border:?1px?solid?#000;position:?relative;?margin:?0?auto;}
.container?.banner{?width:?2100px;?height:?200px;?position:?absolute;??z-index:?1;}
.container?.banner?li{?float:?left;}
.container?.left{?width:?30px;?height:?30px;?color:?#FFFFFF;?font-size:?20px;?
text-align:?center;?line-height:?30px;?background-color:?rgba(0,0,0,.3);
?position:?absolute;?top:?85px;?left:?10px;?z-index:?2;?display:?none;}
.container?.right{?width:?30px;?height:?30px;color:?#FFFFFF;?font-size:?20px;
?text-align:?center;?line-height:?30px;background-color:?rgba(0,0,0,.3);
??position:?absolute;?top:?85px;?right:?10px;?z-index:?2;?display:?none;}
.container:hover?.left{?display:?block;}
.container:hover?.right{?display:?block;}
.container?.left:hover{background-color:?rgba(0,0,0,.7)}
.container?.right:hover{background-color:?rgba(0,0,0,.7)}
.container?.point{?position:?absolute;?top:?180px;?left:?110px;?z-index:?2;}
.container?.point?span{width:?7px;?height:?7px;?border-radius:5px?;?
background:?#FFFFFF;?border:?1px?solid?#000000;?float:?left;?margin-left:?5px;?display:?block;}
.container?.point?span:hover{?background:?#ff8503;}
</style>
</head>
<body>
<div?class="container">
<ul?id="ban"?class="banner"?style="position:?absolute;?left:?0px;">
<li><img?src="../img/img5.jpg"?/></li>
<li><img?src="../img/img1.jpg"?/></li>
<li><img?src="../img/img2.jpg"?/></li>
<li><img?src="../img/img3.jpg"?/></li>
<li><img?src="../img/img4.jpg"?/></li>
<li><img?src="../img/img5.jpg"?/></li>
<li><img?src="../img/img1.jpg"?/></li>
</ul>
<div?class="point">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
</div>
<a?id="prev"?class="left">??<??</a>
<a?id="next"?class="right">?>??</a>
</div>
<script>
window.onload?=?function()
{
var?prev?=?document.getElementById("prev")
var?next?=?document.getElementById("next")
var?ban?=?document.getElementById("ban")
function?srolleft(offset)
{
?ban.style.left?=?parseInt(ban.style.left)?+?offset?+?"px"
?
?if?(ban.style.left?>?-300)?{
ban.style.left?=?-1500?+?"px"
}
if?(ban.style.left?<?-1500)?{
ban.style.left?=?-300?+?"px"
}
}
prev.onclick?=?function()
{
srolleft(-300)
}
next.onclick?=?function()
{
?srolleft(300)
}
}
</script>
</body>
</html>
2016-09-06
<script> ????window.onload?=?function()?{ ????????var?prev?=?document.getElementById("prev"); ????????var?next?=?document.getElementById("next"); ????????var?ban?=?document.getElementById("ban"); ????????function?srolleft(offset)?{ ????????????var?newOffSet?=?parseInt(ban.style.left)?+?offset; ????????????ban.style.left?=?newOffSet?+?"px"; ????????????if?(newOffSet?>?-300)?{ ????????????????ban.style.left?=?-1500?+?"px"; ????????????} ????????????if?(newOffSet?<?-1500)?{ ????????????????ban.style.left?=?-300?+?"px"; ????????????} ????????} ????????prev.onclick?=?function()?{ ????????????srolleft(300); ????????} ????????next.onclick?=?function()?{ ????????????srolleft(-300); ????????} ????} ????</script>把你的代碼完善了下，改動了一點就好了