                        課程
                    
                        /前端開發(fā)
                        
                            /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>

慕數(shù)據(jù)5775487

2016-12-12

源自：JS動畫效果 3-1

關注問題我要回答

921

操作

收起

2 回答

大大的力量回答被采納 +3 積分
2016-12-12

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

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>