求检查一下轮播代码错误!

<!DOCTYPE html>



轮播学习
<br> /*清除默认样式*/<br> <em>{margin: 0px;padding: 0px;list-style: none;}<br> /</em>设置样式*/<br> .wrap{<br> height: 170px;<br> width: 500px;<br> overflow: hidden;<br> margin: 100px auto;<br> position: relative;<br> }<br> .wrap ul{<br> position: absolute;<br> }<br> .wrap ul li{<br> height: 170px;<br> }<br> .wrap ol{<br> position: absolute;<br> right: 10px;<br> bottom: 10px;<br> }<br> .wrap ol li{<br> float: left;<br> height: 20px;<br> width: 20px;<br> background: rgba(255,193,193,0.5);<br> border: 1px solid #FFC125;<br> border-radius: 2px;<br> margin-left: 10px;<br> line-height: 100%;<br> text-align: center;<br> }<br> .wrap ol li.active{<br> background-color: #330099;<br> color: #fff; <br> border: 2px solid green;<br> }<br>

  1. 1
  2. 2
  3. 3
  4. 4
  5. 5
<script type="text/javascript">
    window.onload=function(){
        var wrap=document.getElementById('wrap'),
            pic=document.getElementById('pic'),
            list=document.getElementById('list').getElementsByTagName('li'),
            index=0,
            timer=null;

            if(timer){
                clearInterval(timer);
                timer=null;
            }
            timer=setInterval(autoplay,2000);
            // 定义图片切换函数
            function autoplay(){
                index++;
                if(index>=list.length) {
                    index=0;
                }
                changeoptions(index);
            }
            //鼠标移上时,整个容器停止图片自动切换
            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);
                    changeoptions(this.id);
                }
            }

            function changeoptions(curindex){
                for(var j=0;j<list.length;j++){
                    list[j].calssName='';
                    pic.style.top=0px;
                }
                list[curindex].calssName='active';
                pic.style.top=-curindex*170+'px';
                index=curindex;
            }
    }
</script>


0
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!