关于完美框架的一些优化

上面那个完美框架基本能实现一些功能，但还有一些缺陷，比如我们来看一下这个，加入原有的样式为   #div1{ width:100px; height: 100px; background:green;},如果后来要设置为比较特殊的情况，比如  { width: 200, height: 105,background:'red'},此时你会发现它还没运动完就会停下来，因为高度在经完成后他就会停下来，上面那个框架 运动停止是的判断调价为：

if(iCurr==json[arr]){
clearInterval(obj.timer); //清除当前div的定时器
if(fun){
fun();
}

这样的话，只要有一个方向达到了目标值，他就会停止下来，所以我们要判断的是所有的都到达后他才会停止，所以我们可以加一个判断条件来调节一下：

 

 

 

function setMove(obj,json,fun)
{
var timer = null;
clearInterval(obj.timer);
obj.timer = setInterval(function()
{
　　　　　　　　　　　　　　　　　　//设置 oBstop 这个的目的主要是判断各个目标值到达指定值没有，只有都到达时才会关闭定时器
var oBstop = true;
var iCurr=0;
for(arr in json)
{ 　　　　　　　　　　　　　　　　 //循环json只能用for in循环
if(arr=='opacity')
{ //arr表示对象的属性
var iCurr = parseInt(parseFloat(getStyle(obj,arr))*100); 　　　　　　　　//透明度单独处理，将小数转换成整数
}else{
var iCurr = parseInt(getStyle(obj,arr)); 　　　　　　　　　　　　　　　　 //这里就是获取的当前div的宽度或属性值
}
var iSpeed = (json[arr]-iCurr)/8;
iSpeed=iSpeed>0?Math.ceil(iSpeed):Math.floor(iSpeed); 　　　　　　　　//将当前的速度转化成整型值
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　
if(iCurr!=json[arr])
{
oBstop=false;
};

if(arr=='opacity')
{
obj.style.fliter = 'alpha(:'+(iCurr+iSpeed)+')'; 　　　　　　　　　　 //这里是用整数表示
obj.style.opacity = (iCurr+iSpeed)/100; 　　　　　　　　　　　　 //这里使用小数表示
}else if(arr=='background')
{
obj.style.background = json[arr]; 　　　　　　　　　　　　　　 //当是颜色时，单独设置
}else
{
obj.style[arr]= iCurr+iSpeed+'px'; 　　　　　　　　　　　　　　 //将div的属性以一定速度增加
};

}

//在整个循环之外去检测oBstop的值，只有当都到达时，才会关闭定时器
if(oBstop)
{
clearInterval(obj.timer); 　　　　　　　　　　　　　　　　　　　　//清除当前div的定时器
if(fun){
fun();
}
}
},50);
}

这样通过一个 变量值的检测，就可以使运动都到达后才会关闭定时器，从而实现一定的功能。