function getstyle(obj,attr){ if(obj.currentStyle){ return obj.currentStyle[attr]; } else{ return getComputedStyle(obj,false)[attr]; } } function startMove(obj,json,fn){ clearInterval(obj.timer); obj.timer=setInterval(function(){ for(var attr in json){ var iCur=0; if(attr=='opacity'){ iCur=parseInt(parseFloat(getstyle(obj,attr))*100); } else{ iCur=parseInt(getstyle(obj,attr)); } var speed=(json[attr]-iCur)/8; speed=speed>0?Math.ceil(speed):Math.floor(speed); if(json[attr]==iCur){ clearInterval(obj.timer); if(fn){ fn(); } } else{ if(attr=='opacity'){ obj.style.filter='alpha(opacity:'+(iCur+speed)+')'; obj.style.opacity=(iCur+speed)/100; } else{ obj.style[attr]=iCur+speed+'px'; } } } },30); }window.onload=function(){ var picbox2= document.getElementById('picBox2'); var oul=picbox2.getElementsByTagName('ul')[0]; var oli=oul.getElementsByTagName('li'); var aol=picbox2.getElementsByTagName('ol')[0]; var oliol=aol.getElementsByTagName('li'); var inow=0; var oneheight=oli[0].offsetHeight; var timer=null; for(var i=0;i<oliol.length;i++){ oliol[i].index=i; oliol[i].onmouseover=function(){ for(var i=0;i<oliol.length;i++){ oliol[i].className=''; } this.className='active'; startMove(oul,{top:-this.index*oneheight}); } }picbox2.onmouseover=function(){ clearInterval(timer); } picbox2.onmouseout=function(){ timer=setInterval(torun,2000); } function torun(){ if(inow==oliol.length-1){ inow=0; } else{ inow++; } for(var i=0;i<oliol.length;i++){ oliol[i].className=''; } oliol[inow].className='active'; startMove(oul,{top:-inow*oneheight}); } }
添加回答
举报
0/150
提交
取消