圖片切換不了
<style type="text/css">
* {
margin: 0;
padding: 0;
}
body {
padding: 250px;
}
#paa {
width: 700px;
height: 600px;
overflow: hidden;
position: relative;
border: 2px green solid;
}
#pab {
position: absolute;
z-index: 1;
padding-left:0;
}
img {
float: left;
width: 700px;
height: 600px;
}
#pac {
position: absolute;
z-index:2;
bottom:40px;
right:300px;
}
span {
font-size:20px;
float: left;
margin-right:10px;
color:yellow;
cursor:pointer;
}
span:hover{color:lime;
}
.pad{position:absolute;font-size:50px;z-index:2;text-decoration:none;border:1px silver solid;
display:none;text-align:center;top:300px;background:RGAB(red,0,0,.3);padding:10px;font-weight:bold;
}
#prev{left:10px;cursor:pointer;}
#next{
right:10px;cursor:pointer;
}
#paa:hover .pad{display:block;
}
.pad:hover{
background:fuchsia;}
}
</style>
<script type="text/javascript">
window.onload=function(){
var paa=document.getElementById("paa")
var pab=document.getElementById("pab")
var pac=document.getElementById("pac").getElenmentByTagName("span")
var prev=document.getElementById("prev")
var next=document.getElementById("next")
prev.onclick=function(){
pab.style.left=function(){
pab.style.left=parseInt(pab.style.left)+700+"px"
}}
next.onclick=function(){
pab.style.left=function(){
pab.style.left=parseInt(pab.style.left)-700+"px"
}
}
}
</script>
</head>
<body>
<div id="paa">
<div id="pab" style="left: -700px;">
<img alt="" src="/img/20170108/100006731.jpg/b18c39e3e57a82829b393b8d57065276.jpg" />
<img alt="" src="/img/20170108/100006731.jpg/3ee908dfcc44957669cad16b1698a899.jpg" />
<img alt="" src="/img/20170108/100006731.jpg/6ead85423b7c061ffdd71c363d20f82c.jpg" />
<img alt="" src="/img/20170108/100006731.jpg/a6f76d436fff0440676cecb7e7b1355d.jpg" />
<img alt="" src="/img/20170108/100006731.jpg/ac5a8a8d254f5c8143c219a7ba992b01.jpg" />
<img alt="" src="/img/20170108/100006731.jpg/b18c39e3e57a82829b393b8d57065276.jpg" />
<img alt="" src="/img/20170108/100006731.jpg/3ee908dfcc44957669cad16b1698a899.jpg" /> </div>
<div id="pac">
<span>1</span><span>2</span><span>3</span><span>4</span><span>5</span></div>
<div>
<a href="javascript:;" id="prev" class="pad"><</a> <a href="javascript:;" id="next" class="pad">
></a> </div>
</div>
<body>
</body>
</html>
2017-06-02
親，我的也是這個(gè)錯(cuò)誤，你幫我看看謝謝
2017-06-02
window.onload =function(){
//1、獲取元素 catch element
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');
next.onclick=function(){
list.style.left=parseInt(list.style.left)-600+'px';
console.log('yyyy');
}
prev.onclick=function(){
list.style.left=parseInt(list.style.left)+600+'px';
console.log('xxxx');
}
}
2017-01-16
ok,謝謝了
2017-01-16
另外貼代碼時(shí)選擇一下代碼語(yǔ)言，這格式看了太費(fèi)勁！
2017-01-16
getElenmentByTagName("span")書(shū)寫(xiě)錯(cuò)誤，應(yīng)該是getElenmentsByTagName("span")，
而且你這JS代碼怎么一個(gè)分號(hào)都沒(méi)有？
我沒(méi)調(diào)試，你先把這些基本的錯(cuò)誤先改一下再說(shuō)。