financeC
2016-08-18 11:58
window.onload=function(){
var Li1=document.getElementById('li1');
var Li2=document.getElementById('li2');
var Li1.timer=null;
var Li2.timer=null;
Li1.onmouseover=function(){
startMove(this,'height',400)
}
Li1.onmouseout=function(){
startMove(this,'height',100)
}
Li2.onmouseover=function(){
startMove(this,'width',400)
}
Li2.onmouseout=function(){
startMove(this,'width',200)
}
}
function getStyle(obj,attr)
{
if(obj.currentStyle){return obj.currentStyle[attr];}
else{return getComputedStyle(obj,false)[attr];}
}
function startMove(obj,attr,iTarget){
var icur=parseInt(getStyle(obj,attr));
clearInterval(obj.timer);
obj.timer=setInterval(function(){
var speed=(iTarget-icur)/8;
speed=speed>0?Math.ceil(speed):Math.floor(speed);
if(icur==iTarget){clearInterval(obj.timer);}
else{obj.style[attr]= icur + speed +'px';}
},30);
}
第三行第四行定义初始化了两个timer为啥就不能动了,还有缓冲效果怎么出不来,speed/8的时候效果不对,去掉除以8不能缓冲了,怎么回事呀
timer不是变量,它只是节点的自定义属性,直接就可以添加;而且声明变量的方式是错误的,所以下面的代码不会执行,建议多看控制台信息。那个女老师讲的课还是有很多问题的。
JS动画效果
113925 学习 · 1443 问题
相似问题