                        課程
                    
                        /前端開發(fā)
                        
                            /JavaScript
                        
                        /JS動畫效果

為什么我做出來的效果會抽搐？

<!DOCTYPE?html>
<html>
<head>
	<meta?charset="utf-8">
	<title></title>
	<style?type="text/css">
	*{
		padding:?0;
		margin:0;
	}
	ul?li{
		width:?100px;
		height:?100px;
		background:green;
		margin-bottom:?10px;?

	}
	</style>
	<script?type="text/javascript">
		var?timer;
	
		window.onload=function(){
			var?ali=document.getElementsByTagName("li");
			for(var?i=0;i<ali.length;i++){
				ali[i].timer=null;
				ali[i].onmouseover=function(){
				startMove(this,200);

			}
			?ali[i].onmouseout=function(){
				startMove(this,0);
			}
		}
			
			

			
		}
		function?startMove(obj,iTarget){
				
				clearInterval(obj.timer);
				timer=setInterval(function(){
				speed=(iTarget-obj.offsetWidth)/8;	
				speed=speed>0?Math.ceil(speed):Math.floor(speed);	
				if(obj.offsetWidth==iTarget){
					
					clearInterval(obj.timer);
				}
				else{				
					obj.style.width=obj.offsetWidth+speed+'px';
				}
},50);
			}
	</script>
</head>
<body>
<ul>
	<li></li>
	<li></li>
	<li></li>
</ul>

</body>
</html>

為什么我做出來的效果會抽搐？

要怎么改？