window.onload=function(){

? ? var wrap=document.getElementById('wrap'),

? ? ? ? list1=document.getElementById('pic').getElementsByTagName('li'),

? ? ? ? list=document.getElementById('list').getElementsByTagName('li'),

? ? ? ? index=0,

? ? ? ? timer=null;

? ? ? // 定義并調(diào)用自動(dòng)播放函數(shù)

?function auto(){

?timer=setInterval(function(){

?index++;

?if(index>=list.length){

?index=0;

?}

?changeImg(index);

?},2000)

? ?}

? ? ? auto();

? ? ? // 定義圖片切換函數(shù)

?function changeImg(curIndex){

?for(i=0;i<list.length;i++){

?list[i].className="";

?list1[i].style.display="none";

?}

?list[curIndex].className="on";

?list1[i].style.display="block";

?index=curIndex;

?}

? ? ?

? ? ?// 鼠標(biāo)劃過(guò)整個(gè)容器時(shí)停止自動(dòng)播放

wrap.onmouseover=function(){

? ? ? ? ? clearInterval(timer);

}

? ? ?// 鼠標(biāo)離開(kāi)整個(gè)容器時(shí)繼續(xù)播放至下一張

? ? ?wrap.onmouseout=auto;

? ? ?// 遍歷所有數(shù)字導(dǎo)航實(shí)現(xiàn)劃過(guò)切換至對(duì)應(yīng)的圖片

for(var j=0;j<list.length;j++){

? ? ? ? ? list[j].id=j;

? ? ? ? ? list[j].onmouseover=function(){

? ? ? ? ? ? changeImg(this.id) ? ? ? ??

? ? ? ? ? }

? ? ? ? }

? }