//经过测试发现getStyle(obj,'opactiy')是没有的，所以后面的都错了，但不知道哪里出错了。。。

window.onload = function(){
	var aLi = document.getElementsByTagName('li');
	for(var i=0; i < aLi.length; i++)
	{
		aLi[i].timer = null;
		aLi[i].onmouseover = function(){
			var _this = this;
			startMove(_this,'width',400,function(){
				startMove(_this,'height',400,function(){
					startMove(_this,'opactiy',100);//前面都可以，就这个改变不了
					});
				});
			}
		aLi[i].onmouseout = function(){
			var _this = this;
	//这里若加上变透明度的直接全部运行都恢复不了
				startMove(_this,'height',100,function(){
					startMove(_this,'width',200);
					});
				
			}
	}
}

function startMove(obj,attri,iTarget,fn)
{
	clearInterval(obj.timer);
	obj.timer=setInterval(function()
	{
		var ic=0;
			  if (attri == 'opactiy')
			  {
			     ic=Math.round(parseFloat(getStyle(obj,attri))*100)
			  }
			  else
			  {
	             ic=parseInt(getStyle(obj,attri));
			  }
			var speed=(iTarget-ic)/8;
			speed=speed>0?Math.ceil(speed):Math.floor(speed);
			if (ic==iTarget){
				clearInterval(obj.timer);
				if (fn){
					fn();
				}
			}
			else
			{
				if(attri=='opacity')
				{
					obj.style.opacity = (ic+speed)/100;
					obj.style.filter='alpha(opacity:'+ic+speed+')';
				}	 
				else{
				obj.style[attri]=ic+speed+'px';
				}
			 }
	},30)
}
//获取函数
function getStyle(obj,attri){
	if(obj.currentStyle){
		return obj.currentStyle[attri];//针对ie浏览器
	}
	else{
	    return getComputedStyle(obj,false)[attri];//针对firefox浏览器
	}
}