我點(diǎn)箭頭不動求解，下面我代碼
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<style type="text/css">
.container{
? ? width: 100%;
? ? height: 500px;
? ? overflow: hidden;
? ? position: relative;
}
.carousel{
? ? width: 900px;
? ? height: 500px;
}
.carousel img{
? ? float: left;
? ? position: absolute;
? ? left: 177px;
}
.buttons{
? ? position: absolute;
? ? height: 10px;
? ? width: 100px;
? ? z-index: 2;
? ? bottom: 40px;
? ? left: 585px;
}
.buttons span {
? ? cursor: pointer;
? ? float: left;
? ? border: 1px solid #fff;
? ? width: 12px;
? ? height: 12px;
? ? border-radius:? 50%;
? ? background: #c4c4c4;
? ? margin-right: 6px;
}
.buttons .on{
? ? background-color: rgba(0,0,0,0.6);
}
.arrow{
? ? cursor: pointer;
? ? display: none;
? ? text-align: center;
? ? font-size: 90px;
? ? font-weight: bold;
? ? position: absolute;
? ? z-index: 2;
? ? top: 210px;
? ? color: rgba(0,0,0,0.3);
? ? text-decoration:none;?
}
.arrow:hover{
? ? background-color: #ccc；
}
.container:hover .arrow{
? ? display: block;
}
#prev{
? ? left: 60px;
}
#next{
? ? right: 60px;
}
</style>
<body>
<div class="container">
<div class="carousel" id="list" style="left: -500px;">?
<img id="img" width="900" height="500" src="images/4.jpg" alt="4">
<img id="img" width="900" height="500" src="images/1.jpg" alt="1">
<img id="img" width="900" height="500" src="images/2.jpg" alt="2">
<img id="img" width="900" height="500" src="images/3.jpg" alt="3">
<img id="img" width="900" height="500" src="images/4.jpg" alt="4">
<img id="img" width="900" height="500" src="images/1.jpg" alt="1">
</div>
<div class="buttons" id="buttons">?
<span index="1" class="on"></span>
<span index="2"></span>
<span index="3"></span>
<span index="4"></span>
</div>
<a href="javascript:;" class="arrow" id="prev"><</a>
<a href="javascript:;" class="arrow" id="next">></a>
</div>
</body>
<script type="text/javascript">
window.onload=function(){
var container = document.getElementById('container');
var list = document.getElementById('list');
var buttons = document.getElementById('buttons').getElementsByTagName('span');
var prev = document.getElementById('prev');
var next = document.getElementById('next');
function animate(offset){
list.style.left = parseInt(list.style.left) + offset + 'px';
}
next.onclick = function(){
animate(-500);
}
prev.onclick = function(){
animate(500);
}
}
</script>
</html>
2020-01-08
我的也不動，但是它在dw里面可以動，在網(wǎng)頁上瀏覽就不動了
2019-05-28
next.onclick = function(){
animate(-900);
}
prev.onclick = function(){
animate(900);
}
試試