圖片滑過(guò)后是空白，然后才是另一張圖片？？為什么？？
<link rel="stylesheet" href="header.css" ></link>
<script>
window.onload = function(){
?? ?//獲取各個(gè)標(biāo)簽
?? ?var slide = document.getElementById("slide");
?? ?var list = document.getElementById("list");
?? ?var buttons = document.getElementById("buttons").getElementsByTagName("span");
?? ?var next = document.getElementById("next");
?? ?var prev = document.getElementById("prev");
?? ?
?? ?var index = 1;
?? ?var animated = false;
?? ?//原點(diǎn)按鈕樣式變換
?? ?function showButtons(){
?? ??? ?for (var i = 0;i<buttons.length;i++){
?? ??? ??? ?if(buttons[i].className =='on'){
?? ??? ??? ??? ?buttons[i].className = '';
?? ??? ??? ??? ?break;
?? ??? ??? ?}
?? ??? ?}
?? ??? ?buttons[index-1].className = 'on';
?? ??? ?
?? ?}
?? ?//點(diǎn)擊前進(jìn)按鈕
?? ?next.onclick = function(){
?? ??? ?if(index==3){
?? ??? ??? ?index =1;
?? ??? ?}
?? ??? ?else{
?? ??? ??? ?index +=1;
?? ??? ?}
?? ??? ?showButtons();
?? ??? ?if(animated == false){
?? ??? ??? ?Move(-1899);
?? ??? ?}//list.style.left只能獲取在標(biāo)簽內(nèi)的style ,放在css中則不能
?? ?}
?? ?//點(diǎn)擊后退按鈕
?? ?prev.onclick = function(){
?? ??? ?if(index==0){
?? ??? ??? ?index = 3;
?? ??? ?}
?? ??? ?else{
?? ??? ??? ?index =index-1;
?? ??? ?}
?? ??? ?showButtons();
?? ??? ?if(!animated){
?? ??? ??? ?Move(1899);
?? ??? ?}
??? }
?? ?//點(diǎn)擊原點(diǎn)按鈕滑動(dòng)圖片
?? ?for(var i = 0;i<buttons.length;i++){
?? ??? ?buttons[i].onclick = function(){
?? ??? ??? ?if(this.className == 'on'){
?? ??? ??? ?return;
?? ??? ??? ?}
?? ??? ??? ?var myIndex = parseInt(this.getAttribute('index'));
?? ??? ??? ?var offset = -1899 * (myIndex - index);
?? ??? ??? ?
?? ??? ??? ?index = myIndex;
?? ??? ??? ?showButtons();
?? ??? ??? ?if(!animated){
?? ??? ??? ??? ?Move(offset);
?? ??? ??? ?}
?? ??? ?}
?? ?}
?? ?//圖片定時(shí)滾動(dòng)
?? ?slide.onmouseover = iStop();
?? ?slide.onmouseout = play();
?? ?play();
}
function Move(offset){
?? ?var newLeft = parseInt(list.style.left) + offset;
?? ?var time = 300;//位移總時(shí)間;
?? ?var interval = 1;//位移間隔時(shí)間
?? ?var speed = offset/(time/interval);//每次位移量
?? ?
?? ?function go(){
?? ??? ?if((speed < 0 && parseInt(list.style.left)>newLeft) || (speed>0 && parseInt(list.style.left)<newLeft)){
?? ??? ?list.style.left = parseInt(list.style.left)+speed +'px';
?? ??? ?setTimeout(go,interval);
?? ??? ?}
?? ??? ?else{
?? ??? ??? ?animated = false;
?? ??? ??? ?list.style.left = newLeft + 'px';
?? ??? ??? ?list.style.left = newLeft + 'px';
?? ???????? if(newLeft < -7596){
?? ??? ?????? list.style.left =? 0+ 'px';
?? ???????? }
?? ???????? if(newLeft> 0){
?? ??? ???? list.style.left = -7596 + 'px';
?? ???????? }
???????? }
?? ?
??? }
?? ?go();
}
function play(){
?? ?var timer = null;
?? ?timer = setInterval(function(){
?? ??? ?next.onclick();
?? ??? ?},3000);
?? ?}
function iStop(){
?? ?clearInterval(timer);
?? ?}
</script>
</head>
<body>
<div id="header">
</div>
<div id="wrap">
<div id="head">
<!--滑動(dòng)的圖片 -->
<div id="slide">
? <div id="list" style="left:0px;">
??? <img src="images/60M58PICWFD_1024.jpg" width="1899" height="625" />
??? <img src="images/8952533_120845629000_2.jpg" width="1899" height="625" />
??? <img src="images/full_562_11922.jpg" width="1899" height="625" />
??? <img src="images/60M58PICWFD_1024.jpg" width="1899" height="625" />
??? <img src="images/8952533_120845629000_2.jpg" width="1899" height="625" />
? </div>
? <div id="buttons">
???? <span index="1" class="on"></span>
???? <span index="2"></span>
???? <span index="3"></span>
? </div>
? <a href="javascript:;" class="arrow" id="prev"> < </a>
? <a href="javascript:;" class="arrow" id="next"> > </a>
? <!-- more equipment adapter -->
</div><!--slide -->
</div><!-- head -->
ps:我把圖片換成全屏滾動(dòng)了
求大神幫忙
2016-09-30
我的是 五張圖，前四個(gè)顯示。第五個(gè)顯示空白。后來(lái)發(fā)現(xiàn)是寬度設(shè)了五張圖，沒(méi)有加兩張輔助圖的?
2016-08-23
我不知道我有沒(méi)有理解錯(cuò)你的意思，不過(guò)你的按鈕背景顏色的切換應(yīng)該是有問(wèn)題的。 ? ? ?
? if(index==0){
?? ??? ??? ?index = 3;
?? ??? ?}
?? ??? ?else{
?? ??? ??? ?index =index-1;
?? ??? ?}
點(diǎn)擊后退時(shí)，當(dāng) index = 1，此時(shí)執(zhí)行 減 1 ，會(huì)變成 0 ，然后執(zhí)行 showButton 函數(shù)， buttons[index - 1] 也就是 buttons[-1]，此時(shí)沒(méi)有按鈕會(huì)有背景顏色，當(dāng)再點(diǎn)擊后退，index = 0，才會(huì)執(zhí)行 index = 3 語(yǔ)句，然后。。。你懂的