為什么我這里按鈕切換沒有用
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無(wú)標(biāo)題文檔</title>
<link rel="stylesheet" href="Untitled-2.css" type="text/css">
</head>
?
<body>
<div class="swiper">
<div class="container" style="left:-600px">
? ? ? ? <div class="slide slide1"></div>
? ? ? ? <div class="slide slide2"></div>
? ? ? ? <div class="slide slide3"></div>
? ? ? ? <div class="slide slide4"></div>
? ? ? ? <div class="clear"></div>
? ? </div>
? ? <div class="bottons">
? ? <div class="botton1 botton left"></div>
? ? ? ? <div class="botton2 botton left"></div>
? ? ? ? <div class="botton3 botton left"></div>
? ? ? ? <div class="botton4 botton left"></div>
? ? ? ? <div class="clear"></div>
? ? </div>
? ? <div class="arrow prev"><</div>
? ? <div class="arrow next">></div>
</div>
<script>
window.onload=function(){
var swiper=document.getElementsByClassName("swiper");
var container=document.getElementsByClassName("container");
var slide=document.getElementsByClassName("slide");
var botton=document.getElementsByClassName("botton");
var prev=document.getElementsByClassName("prev");
var next=document.getElementsByClassName("next");
function animate(offset){
container.style.left=parseInt(container.style.left)+offset+"px";
};
prev.onclick=function(){
animate(600);
};
next.onclick=function(){
animate(-600);
}
}
</script>
</body>
</html>
2016-06-17
首先你使用document.getElementsByClassName()來獲取元素其實(shí)獲取的是一個(gè)數(shù)組，并不是這個(gè)元素，你這樣寫document.getElementsByClassName("container")[0]; 在獲取元素后加個(gè)[0],，然后再點(diǎn)擊prev或者next就會(huì)發(fā)現(xiàn)容器的left值有變化
2016-06-12
你Class給的BUTTONS
調(diào)用的時(shí)候是button
2016-05-31
css另外寫的..加載進(jìn)去了
2016-05-31
沒圖片當(dāng)然沒有用