沒有全部按照老師寫的，，寫出了就是有一個問題 圖片從第一張到最后一張 和最后一張到一張有空白 ，，，仔細檢查后發現是判斷的原因，left值每次要多運動500px，求大神指點解決的方法！?。?/p>

/*html結構*/

/*代碼部分*/

//獲取屬性值

function getStyle(element, attr) {

if(element.currentStyle) {

return element.currentStyle[attr];

} else {

return getComputedStyle(element, false)[attr];

}

}

window.onload = function() {

var container = document.querySelector(".warp");

var oUl = container.querySelector(".list");

var oLi = container.querySelector(".list").getElementsByTagName("li");

var Btn = container.querySelector(".buttons");

var oSpan = Btn.getElementsByTagName("span");

var Prev = container.querySelector(".prev");

var Next = container.querySelector(".next");

var arr=[];

var num = 0;

var onff=false;

var timer;

//初始化

for (var i=0;i<oLi.length;i++) {

arr.push(oLi[i]);

}

//console.log(arr[0].innerHTML);

//設置按鈕

for(var i = 0; i < oLi.length; i++) {

Btn.innerHTML += "<span>" + (i + 1) + "</span>";

oSpan[i].setAttribute('index', '' + i + '');

}

var aSpan = oSpan[num];

//設置按鈕樣式

function showBtn() {

for(var i = 0; i < oSpan.length; i++) {

oSpan[i].className = '';

}

oSpan[num].className = "active";

}

showBtn();

//獲取li總寬度

var li_Width = parseInt(getStyle(oLi[0], "width")) * oLi.length;

//給ul設置寬度

oUl.style.width = li_Width + 'px';

//獲取一個li的寬度

var one_Li = parseInt(getStyle(oLi[0], "width"));

//運動函數

function animate(offset) {

onff=true;

//新的left值

newLeft = parseInt(getStyle(oUl, "left")) + offset;

var time=300;//位移總時間

var interval=30;//位移間隔時間 ?

var speed=offset/(time/interval);//每次位移量

function go(){

if(speed<0 && parseInt(getStyle(oUl, "left")) > newLeft||speed>0 &&

parseInt(getStyle(oUl, "left"))<newLeft){

oUl.style.left = parseInt(getStyle(oUl, "left"))+speed+'px';

setTimeout(go,interval);

}else{

onff=false;

oUl.style.left = newLeft + 'px';

//判斷圖片滑到最后一張

if(newLeft < -(li_Width - one_Li)) {

oUl.style.left = 0 + 'px';

};

//判斷圖片滑到第一張

if(newLeft > 0) {

oUl.style.left = -(li_Width - one_Li) + 'px';

}

}

}

go();

}

function autoPlay(){

timer=setInterval(function(){

Next.onclick();

},2000);

}

autoPlay();

function stop(){

clearInterval(timer);

}

container.onmouseover=stop;

container.onmouseout=autoPlay;

//上一張

Prev.onclick = function() {

if(onff){

return;

}

num--;

if(num == -1) {

num = oSpan.length - 1;

}

showBtn();

animate(600);

}

//下一張

Next.onclick = function() {

if(onff){

return;

}

num++;

if(num > oSpan.length - 1) {

num = 0;

}

showBtn();

animate(-600);

}

//按鈕點擊事件

for(var i = 0; i < oSpan.length; i++) {

oSpan[i].onclick = function() {

//自定義下標

var myIndex = parseInt(this.getAttribute('index')); //獲取按鈕的index屬性=>下標

/*疑問？*/

var offset = -600 * (myIndex - num);

if(onff){

return;

}

animate(offset);

num = myIndex;

showBtn();

}

}

}