```javascript
//多屬性同時運動封裝(callback用于鏈式運動)
function animate(obj,param,callback,speedTime = 20){
//callback是接收了一個回調(diào)函數(shù)载庭。這個回調(diào)函數(shù)需要在屬性到達目標值時執(zhí)行
if(!!callback && !(callback instanceof Function)){//callback有值，并且又不是函數(shù)
//將時間賦值給speedTime
speedTime = callback;
//將callback置為undefined
callback = undefined;
}
clearInterval(obj.timer);
obj.timer = setInterval(function(){
var flag = true;
for(var attr in param){
//zIndex屬性不需要動畫，直接賦值就可以了
if(attr === "zIndex" || attr === "display"){
obj.style[attr] = param[attr];
}else{
var current = 0;
if(attr === "opacity"){
current = getStyle(obj,attr) * 100;
}else{
current = parseInt(getStyle(obj,attr));
}
var speed = (param[attr] - current)/10;
speed = speed > 0 ? Math.ceil(speed) : Math.floor(speed);
//判斷是否所有的屬性都到達了目標 值
if(param[attr] != current){//最少有一個沒有到達目標值
flag = false;//flag為false表示最少有一個沒有到達目標值
//沒有到達目標值繼續(xù)賦值
if(attr == "opacity"){
obj.style[attr] = (current + speed)/100;
}else{
obj.style[attr] = current + speed + "px";
}
}
}
}
//上面的for in循環(huán)沒有去執(zhí)行澜公，flag保持為true時维咸，說明這一次的運動過程所有的屬性都到達了目標值
if(flag){//
clearInterval(obj.timer);
//到達目標值回懦，開啟鏈式
if(!!callback){
callback();
}
}
},speedTime);
}
//兼容ie8實現(xiàn)獲取瀏覽器渲染的一元素樣式值闽撤。
function getStyle(obj,attr){
if(!!window.getComputedStyle){//現(xiàn)代瀏覽器
return window.getComputedStyle(obj)[attr];
}
//ie8
return obj.currentStyle[attr];
}
```
多屬性同時運動封裝(callback用于鏈式運動)
