错在哪里？求大神帮忙！-慕课网

错在哪里？求大神帮忙！

来源：3-1 JS缓冲动画

慕数据5775487

2016-12-12 20:53

<!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>

写回答关注

2回答

大大的力量: 2016-12-12 22:19:07

已采纳

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>

2 0

慕数据577...

非常感谢！

2016-12-12 23:22:01

共 2 条回复 >

_爱健身的码农_03883871

2016-12-12 23:04:01

div.onmouseover=function(){
move(this,0);
}
function move(obj,iTarget){
var div=document.getElementById('div');

clearInterval(obj.timer);
obj.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);
}
div变量放在里边，math写错了

0 0

JS动画效果

通过本课程JS动画的学习，从简单动画开始，逐步深入各种动画框架封装

113931 学习 · 1443 问题

查看课程

相似问题

求大神帮忙看看哪里错了，显示不出

回答 2

求大神帮忙看看

回答 1

求大神帮忙看看

回答 2

求大神帮忙，看看哪里出错了，老是到达目标值

回答 3

大神帮忙看一下，问题在哪?

回答 1

打开慕课网App查看更多内容