看了这个最后那个完美的运动框架发现一个问题,同时运动的定时器并没有结束。。。。。定时器还在一直运行,只不过不在动画了而已。
1 回答
//获取当前样式
function getStyle(obj,attr){
if(obj.currentStyle){
return obj.currentStyle[attr];
}
return getComputedStyle(obj,false)[attr];
}
//运动框架
/**
* @param obj
* @param json
* @param fn
*/
function startMove(obj,json,fn){
clearInterval(obj.timer);
var size = (function(){
var tt = 0;
for(var i in json){
tt++;
}
return tt;
}());
obj.timer = setInterval(function(){
var count = 0;//判断同时运动是否结束
for(var i in json){
//判断透明度
var icur = 0; //获取当前样式
if(i=="opacity"){
icur = Math.round(parseFloat(getStyle(obj,i))*100);
}else{
icur = parseInt(getStyle(obj,i));
}
var iTarget = json[i];
//缓冲运动获取speed (+ 越来越慢 -越来越慢)
var ispeed = iTarget-icur>0?Math.ceil((iTarget-icur)/8):Math.floor((iTarget-icur)/8);
//停止运动
if(icur != iTarget){
if(i=="opacity"){//透明度
obj.style.filter="alpha(opcoty:'"+(icur+ispeed)+")";
obj.style.opacity=(icur+ispeed)/100;
}else{
obj.style[i] = icur+ispeed+"px";
}
}else{
count++;
//判断所有运动是否结束
if(count==size){
clearInterval(obj.timer);
if(fn){
fn();
}
}
}
}
},30);
}
举报