大家帮忙看看呗

来源:4-1 JS多物体动画

financeC

2016-08-18 12:03

window.onload=function(){

var aLi=document.getElementsByTagName('li');

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

aLi[i].timer=null;

aLi[i].onmouseover=function(){

startMove(this,400);

}

aLi[i].onmouseout=function(){

startMove(this,200);

}

}

}


function getStyle(obj,attr)

{

if(obj.currentStyle){return obj.currentStyle[attr];}//IE


else{return getComputedStyle(obj,false)[attr];}//firefox

}

function startMove(obj,iTarget){

var icur=parseInt(getStyle(obj,'height'))

clearInterval(obj.timer);

obj.timer=setInterval(function(){

var speed=(iTarget-icur);

speed=speed>0?Math.ceil(speed):Math.floor(speed);

if(icur==iTarget){clearInterval(obj.timer);}

else{obj.style.height= icur + speed +'px';}

},30);

}

怎么啦,哪里出错了啊,感觉用style就不出效果,offset可以

写回答 关注

1回答

  • 不如怀念o
    2016-08-18 17:35:20
    已采纳

    aLi[i].timer=null;首先说一下,timer是节点自定义属性,不需要初始化为null;你应该去看看width、clientWidth、offsetWidth的定义。

JS动画效果

通过本课程JS动画的学习,从简单动画开始,逐步深入各种动画框架封装

113925 学习 · 1443 问题

查看课程

相似问题