跑起来了,但是为什么没有停下来啊?求救啊,求救。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
#div1{
width: 200px;
height: 80px;
background-color: #c22;
position: relative;
left: -200px;
top: 0px;
}
#div1 span{
width: 20px;
height: 20px;
background-color: blue;
position: absolute;
left: 200px;
top: 30px;
}
</style>
<script>
window.onload = function(){
var odiv= document.getElementById('div1');
odiv.onmouseover=function(){
startmove();
}
}
var timer = null;
function startmove(){
clearInterval(timer)
var odiv = document.getElementById('div1');
timer = setInterval(function(){
if(odiv.offsetLeft == 100){
clearInterval(timer);
}
else{
odiv.style.left = odiv.offsetLeft+10+'px';
}
},30)
}
</script>
</head>
<body>
<div id="div1"><span></span></div>
</body>
</html>