html第八章课后作业京东轮播,仿京东js轮播图

var aArr = document.getElementsByTagName("a");

var liArr = document.getElementsByTagName("li");

var spArr = document.getElementsByTagName("span");

var box = document.getElementById("box");

var count = 0;

spArr[1].onclick = fn1;

spArr[0].onclick = fn2;

var timer = setInterval(fn1, 1000);

box.onmouseover = function() {

clearInterval(timer);

}

box.onmouseout = function() {

timer = setInterval(fn1, 1000);

}

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

liArr[i].onclick = fn3;

}

function fn1() {

count++;

if (count === aArr.length) {

count = 0;

}

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

aArr[i].className = "";

liArr[i].className = "";

}

aArr[count].className = "show";

liArr[count].className = "current";

}

function fn2() {

count--;

if (-1 == count) {

count = aArr.length - 1;

}

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

aArr[i].className = "";

liArr[i].className = "";

}

aArr[count].className = "show";

liArr[count].className = "current";

}

function fn3() {

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

aArr[i].className = "";

liArr[i].className = "";

}

aArr[this.innerHTML - 1].className = "show";

liArr[this.innerHTML - 1].className = "current";

}