问答详情
源自:6-2 完美运动框架

flag是怎么变成true的??

window.onload = function(){
    var li = document.getElementById('li1');
    li.onmouseover = function(){
        startMove(li,{'width':400,'height':200})
    }			
    li.onmouseout = function(){				
        startMove(li,{'width':200,'height':100})			
    }		 
}		

//运动框架 startMove函数		
function startMove(obj,json,fn){			
    clearInterval(obj.timer);
    var flag = true;			
    //开启定时器			
    obj.timer = setInterval(function(){				
        //遍历json				
        for (var attr in json) {					
            var speed = 0;					
            //取当前值 icur					
            if (attr == 'opacity') {						
                var icur = Math.round(parseFloat(getStyle(obj,attr))*100);					
            }else{						
                var icur = parseInt(getStyle(obj,attr));					
            }					
            //算速度:speed
            //目标值:json[attr]					
            if (icur < json[attr]) {						
                speed = Math.ceil((json[attr] - icur)/8);					
            }else{						
                speed = Math.floor((json[attr] - icur)/8);					
            }							
            //检测停止					
            if (icur != json[attr]) {						
                flag = false					
            }					
            if (attr == 'opacity') {						
                obj.style.filter = 'alpha(opacity:'+icur+speed+')';						
                obj.style.opacity = (icur+speed)/100;					
            }else{						
                obj.style[attr] = icur + speed + 'px';					
            }   
        }
        //动画结束时,这里 flag 是怎么变成 true 的???????				
        if (flag) {					
            clearInterval(obj.timer);					
            if (fn) {fn()}				
        }         				
    },30)		
}


提问者:慕粉3673019 2018-09-14 16:27

个回答

  • 慕粉3673019
    2018-09-14 18:14:30

    视频中flag的声明位置应该是写错了,实际上应该是写在定时器内。

    视频中为什么动画会停止?完全是因为speed归0了,动画停止了,但实际上定时器并没有停止,还在继续运行。

    感谢 @纸丶两面白   同学!