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

鼠标移入和移出没有变化

<style>			body,div,span{				margin:0;				padding:0;			}			#div1{				width:200px;				height:200px;				background:red;				position:relative;				left:-200px;				top:0;			}			#div1 span{				width: 20px;				height: 50px;				background: blue;				position: absolute;				left: 200px;				top: 75px;			}		</style>		<script>			window.onload=function(){				var oDiv=document.getElementById('div1');				oDiv.onmousemove=function(){					startMove(10,0);				}				oDiv.onmouseout=function(){					startMove(-10,-200);				}			}			var timer=null;			function startMove(iTarget){				clearInterval(timer);				var oDiv=document.getElementById('div1');				timer=setInterval(function(){					var speed=0;					if(oDiv.offsetLeft>iTarget){						speed=-10;					}					else {						speed=10;				}				if(oDiv.offsetLeft==iTarget){					clearInterval(timer);				}				else{					oDiv.style.left=oDiv.offsetLeft+speed+'px';				}			},30)			}		</script>	</head>	<body>		<div id="div1"><span id="share">分享</span></div>			</body>

qq_慕移动0355785

2019-07-17

源自：JS动画效果 2-1

关注问题我要回答

876

操作

收起

1 回答

慕九州0567575
2019-07-23

function startMove(iTarget)函数里你只有一个参数，但是调用的时候你传了两个 startMove(10,0);

改成只传目标值就可以了；

oDiv.onmousemove=function(){                    startMove(0);                }               
oDiv.onmouseout=function(){                 startMove(-200);                }