同时运动


	<script type="text/javascript">
		window.onload = function(){
			var li1 = document.getElementById('li1');
			li1.onmousemove = function(){
				startMove(li1,{width:201,height:200,opacity:100});
			}
			li1.onmouseout = function(){
				startMove(li1,{width:200,height:100,opacity:30});
		    }
	    }
        
            function getStyle(obj,attr){
			if(obj.currentStyle){
				return obj.currentStyle[attr];
			}else{
				return getComputedStyle(obj,false)[attr];
			}
		}
		//stareMove(obj,{attr1:itarget1,attr2:itarget2},fn)
		function startMove(obj,json,fn){
			var flag=true;//假设
			clearInterval(obj.timer);
			obj.timer=setInterval(function(){
				for(var attr in json){
				var icur=0;
				if(attr == 'opacity'){
					var icur = parseFloat(getStyle(obj, attr))*100;
				}else{
					var icur = parseInt(getStyle(obj, attr));
				}
				var speed  = (json[attr]-icur)/8;
				speed=speed>0?Math.ceil(speed):Math.floor(speed);
				if(icur != json[attr])  //若不满足当前值,则flag=false
				{
					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){  //如果满足flag,停止计时器
					clearInterval(obj.timer);
					if(fn){
						fn();
					}
				}
			},30);
		}
	</script>
    
    		

此处用到json。格式为 var json={name:key}

 例如:json:{a:12,b:13}        遍历需要用for in。

例如 for(var i in json){  alert(i);   }         此时会依次弹出 a b。

                    若改为  alert( json[i] )       则依次弹出 12  13.

猜你喜欢

转载自blog.csdn.net/qq_32522799/article/details/85000617