window.onload=function(){? ? var wrap=document.getElementById('wrap'),? ? ? ? pic=document.getElementById('pic').getElementsByTagName('li'),? ? ? ? list=document.getElementById('list').getElementsByTagName('li'),? ? ? ? index=0,? ? ? ? timer=null;? ? ? // 定義并調用自動播放函數 function autoPlay(){ index++; if(index >= pic.length){ index = 0; } changePic(index); } ? ? ? timer = setInterval(autoPlay,2000); ?// 定義圖片切換函數? ? ? function changPic(thisIndex){ for(var j = 0; j < pic.length; j++){ pic[j].style.display = 'none'; list[j].className = ''; } pic[thisIndex].style.display = 'block'; //pic.style.top = "-" + thisIndex*170 +"px"; list[thisIndex].className = 'on'; } ? ? ?// 鼠標劃過整個容器時停止自動播放 wrap.onmouseover = function(){ clearInterval(timer); } ? ? ?// 鼠標離開整個容器時繼續播放至下一張? ? wrap.onmouseout = function(){ timer = setInterval(autoPlay,2000); } ? ? ?// 遍歷所有數字導航實現劃過切換至對應的圖片 for(var i = 0; i< list.length; i++){ list[i].id = i; list[i].onmouseover = function(){ clearInterval(timer); changPic(this.id); } }? ?}