window.onload=function(){

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

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

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

        index=0,

        timer=null;

      // 定义并调用自动播放函数

 function auto(){

 timer=setInterval(function(){

 index++;

 if(index>=list.length){

 index=0;

 }

 changeImg(index);

 },2000)

   }

      auto();

      // 定义图片切换函数

 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;

 }

     // 鼠标划过整个容器时停止自动播放

wrap.onmouseover=function(){

          clearInterval(timer);

}

     // 鼠标离开整个容器时继续播放至下一张

     wrap.onmouseout=auto;

     // 遍历所有数字导航实现划过切换至对应的图片

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

          list[j].id=j;

          list[j].onmouseover=function(){

            changeImg(this.id)         

          }

        }

  }