关于轮播效果

Question

         <div id="share-pic">

        <img src="images/36486584.png">

                    <img src="images/3158415498.png">

                    <img src="images/354816841.png">

            </div>

            <ul id="share-list">

            <li class="share-cur"></li>

                <li></li>

                <li></li>

            </ul>

var imgs=document.getElementById("share-pic").getElementsByTagName("img");

var lists=document.getElementById("share-list").getElementsByTagName("li");

var index=0;

var timer=null;

for(var x=0;x<lists.length;x++){

lists[x].index=x;

lists[x].onclick=function(){

clearInterval(timer);

change(this.index);

}

}

timer=setInterval(function(){

index++;

if(index>=lists.length){

index=0;

}

change();

},2000);

function change(){

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

imgs[i].style.display='none';

lists[i].className='';

}

imgs[index].style.display='block';

lists[index].className='share-cur';

}

自动播放是正常的，点击之后就没效果，自动播放也停止了，求大神指教

Answer 1

点击的时候都clearInterval了。还怎么自动轮播