                        课程
                    
                        /前端开发
                        
                            /JavaScript
                        
                        /JS动画效果

错在哪里？求大神帮忙！

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			*{
				margin:0;
				padding:0;
			}
			#div{
				width:200px;
				height:200px;
				background:red;
				position:relative;
				left:-200px;
				
			}
			#div span{
				width:20px;
				height:50px;
				background:blue;
				position:absolute;
				left:200px;
				top:75px;
				color:white;
				padding-top:10px;
			}
		</style>
		<script>
			window.onload=function(){
				var div=document.getElementById('div');
				
				div.onmouseover=function(){
					move(0);
				}
				div.onmouseout=function(){
					move(-200);
				}
			}
			
			var div=document.getElementById('div');
				var timer;
				function move(iTarget){
					clearInterval(timer);
					timer=setInterval(function(){
						var speed = (iTarget-div.offsetLeft)/20;
							speed = speed>0?math.ceil(speed):math.floor(speed);
						if(div.offsetLeft==iTarget){
							clearInterval(timer);
						}else{
							div.style.left=div.offsetLeft+speed+'px';
						}
						
					},30);
				}
				
			
		</script>
	</head>
	<body>
		<div id="div">
			<span id="share">分享</span>
		</div>
	</body>
</html>

慕数据5775487

2016-12-12

源自：JS动画效果 3-1

关注问题我要回答

872

操作

收起

2 回答

大大的力量回答被采纳 +3 积分
2016-12-12

1,var div=document.getElementById('div'); 放在move函数里面

2，math改成大写 Math

        <script>
            window.onload=function(){
                var div=document.getElementById('div');
                 
                div.onmouseover=function(){
                    move(0);
                }
                div.onmouseout=function(){
                    move(-200);
                }
            }
             
            var timer;
            function move(iTarget){
            	var div=document.getElementById('div');
                clearInterval(timer);
                timer=setInterval(function(){
                    var speed = (iTarget-div.offsetLeft)/20;
                        speed = speed >0 ? Math.ceil(speed):Math.floor(speed);
                    if(div.offsetLeft==iTarget){
                        clearInterval(timer);
                    }else{
                        div.style.left=div.offsetLeft+speed+'px';
                    }
                     
                },30);
            }     
        </script>