为了账号安全,请及时绑定邮箱和手机立即绑定

为什么清除定时器没有用,运动后停不下来

<!DOCTYPE  html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta  http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>速度动画</title>

<style type="text/css">

  div{margin:0; padding: 0;}

  #div1{width: 200px;height: 200px;background: red;position: relative;left: -200px;top:0px;}

  #share{width: 20px;height: 50px; position: absolute;left: 200px;top: 75px;background: blue;}

</style>


</head>

<body>

  <div id="div1">

  <span id="share">分享</span>

  </div>

</body>

<script type="text/javascript">

window.onload=function(){

     var oDiv=document.getElementById('div1');

       oDiv.onmouseover=function(){

        startMove();

       }

}


var timer=null;


function startMove(){

var oDiv=document.getElementById('div1');

 var timer=setInterval(function(){

if(oDiv.offsetLeft==0){

clearInterval(timer);

}

else{

oDiv.style.left=oDiv.offsetLeft+10+"px";

   }

},30)

}

</script>

</html>


正在回答

2 回答

我的定时器也清楚不了,一直没有找到答案

0 回复 有任何疑惑可以回复我~
#1

sulin 提问者

我的找到问题所在了,首先要*{margin:0; padding: 0;}来初始化清除所有样式,否则后来的判断条件里,if(oDiv.offsetLeft==0),这个oDiv.offsetLeft==0的临界条件永远都满足不了,因为默认的样式都有个值。
2016-05-29 回复 有任何疑惑可以回复我~

你清除的是计时器叠加,并不是清除的计时器

0 回复 有任何疑惑可以回复我~
#1

sulin 提问者

不是啊,我是在判断条件if(oDiv.offsetLeft==0){ clearInterval(timer); }里清除的定时器啊
2016-05-24 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消
JS动画效果
  • 参与学习       113925    人
  • 解答问题       1443    个

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

进入课程

为什么清除定时器没有用,运动后停不下来

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信