想加个定时器让他自动切换怎么加?

来源:4-2 综合实战题

慕标6631155

2016-09-30 10:30

想加个定时器让它自动切换怎么加??

// JavaScript Document


function bind(els,eventType,callback){

if( typeof els.addEventListener==='function'){

els.addEventListener(eventType,callback,false);//标准事件绑定方法

}else if(typeof els.attechEvent==='function'){

els.attechEvent('on'+eventTyep,callback);//IE事件绑定方法

}

}


function mouseoverlist(e){

var target=e.target||e.srcElement;

var box=document.getElementById('box');//取得外部元素

var list=box.getElementsByTagName('li');//取得每个列表项

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

 

list[i].className='item';

 

}

while(target.tagName != 'LI' || target.tagName == 'BODY'){

        target = target.parentNode;

    }

    

    //给当前元素加上class big

    target.className = 'item big';  

}


function intlist(){

 var box=document.getElementById('box');//取得外部元素

 var list=box.getElementsByTagName('li');//取得每个列表项

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

bind(list[i],'mouseover',mouseoverlist);//对每个列表绑定鼠标悬停事件的监听

}


}

intlist();//执行函数


写回答 关注

3回答

  • qq_缔曦_04032696
    2016-12-03 12:33:11

    对了,要在mouseover函数首部清除循环。clearInterval(timer);

  • qq_缔曦_04032696
    2016-12-03 12:31:03


    //在bind(list[i],'mouseover',mouseoverlist);后面再加一个bind(list[i],'mouseover',mouseout);
    //然后定义mouseout函数
    function mouseout() {
    	timer=setInterval(function(){
        var list=document.getElementsByTagName("li");
        for(var i=0;i<list.length;i++){
        	console.log("******************************");
        	console.log("i="+i);
        	console.log("list["+i+"].className="+list[i].className);
            if(list[i].className.indexOf("big") > 0 ){
            console.log("-------------");
            list[i].className=list[i].className.replace('big','');
            console.log("list["+i+"].className="+list[i].className);
            var j=i+1;
            if(j==5){j=0};
            console.log("j="+j);
            console.log("下一个的当前"+list[j].className)
            list[j].className=list[j].className+" big";
            console.log("下一个的改变后"+list[j].className);
            console.log("-------------");
            break;
            }
            console.log("******************************");
        }
    },2000)
    }
    console.log是我测试时用的可以删掉,妹的,因为一个==判断写成了=害的我改了半天。 = =


  • qq_Jabo
    2016-10-01 17:34:45

    把事件绑定去了,切换li的big类使用setInterval来切换就好了,这个应该更简单啊

手风琴效果

本视频教程通过实例讲解,教你轻松制作手风琴效果,学起来吧

40807 学习 · 115 问题

查看课程

相似问题