关于完美运动框架定义的flag应该怎么放位置？
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script>
// var json={a:12};json 格式
function startMove(obj, json, fn) {
clearInterval(obj.timer);//获取样式的方法（项目，属性，目标值）
obj.timer = setInterval(function () {
// var flag = true;//注意这个不能放到for循环里面！！！
for (var attr in json) {
var flag = true;
var icur = 0;//现在属性的值
//当属性为透明度的时候
if (attr == 'opacity') {
var icur = Math.round(parseFloat(getStyle(obj, attr)) * 100); //Math.round 四舍五入的函数方法。
}
else {
var icur = parseInt(getStyle(obj, attr));
}
//获取速度
var speed = (json[attr] - icur) /10;
speed = speed > 0 ? Math.ceil(speed) : Math.floor(speed);
//是否到达目标值
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';//这里要注意！！
}
if (flag) {
clearInterval(obj.timer);
if (fn) {
fn();
}
}
}
}, 10.0);
}
function getStyle(obj, attr) {
if (obj.currentStyle) {
return obj.currentStyle[attr];
}
else {
return getComputedStyle(obj, false)[attr];
}
}
</script>
<style>
#div1 {
width: 200px;
height: 200px;
position: relative;
background: yellow;
opacity: 0.5;
filter: alpha(opacity:50);
}
</style>
<script>
window.onload = function () {
var oDiv = document.getElementById('div1');
oDiv.onmouseover = function () {
startMove(oDiv, { width: 400, height: 400,opacity:100});
}
oDiv.onmouseout = function () {
startMove(oDiv, { width: 200, height: 200,opacity:50 });
}
}
</script>
</head>
<body>
<div id="div1"></div>
</body>
</html>
定义的flag放在for循环里面和放在for循环外面为什么在显示的属性上有差异？放在外面可以正常运行，而放在里面的话。width，height的值就会变小？理论上不是放在里面和外面的效果是一样的吗？是什么原因而产生的差异？
