完美运动框架全面剖析

源码：

function perfect(obj,josn,fn){

            clearInterval(obj.timer);//清除定时器
            var flag=true;//用于判断是否全部动画执行完成
            obj.timer=setInterval(function(){

                for(var attr in josn) {

                   //取当前值

                    var off = 0;
                    if (attr == 'opacity') {
                        off = Math.round(parseFloat(getStyle(obj, attr)) * 100);
                    }
                    else {
                        off = parseInt(getStyle(obj, attr));

                    }

                   //算速度

                    var speed = (josn[attr] - off) / 8;

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

                   //停止检测

                    if (off != josn[attr]) {
                        flag=false;
                    }
                        if (attr == 'opacity') {
                            obj.style.filter = 'alpha(opacity:' + (off + speed) + ')';
                            obj.style.opacity = (off + speed) / 100;
                        } else {
                            obj.style[attr] = off + speed + 'px';
                        }
                    }
                if(flag){
                    clearInterval(obj.timer);
                    if (fn) {
                        fn();
                    }
                }
            },20)

        }

         //取元素样式函数

        function getStyle(obj,att){
            if(obj.currentStyle){
                return obj.currentStyle[att];//IE
            }
            else{
                return getComputedStyle(obj,false)[att];//WebKit
            }

        }