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

请问我的代码错误哪里!非常感谢!

<!doctype html>

<html>

 <head>

   <title>多物体运动动画</title>

   <meta charset="utf-8">

   <style>

   *{margin:0;padding: 0px;color: #FFF}

   ul,li{list-style: none}

   ul li{background: yellow;width: 200px;height: 100px;margin-bottom: 20px}

   </style>

   <script type="text/javascript">

   window.onload=function(){

      var lis=document.getElementsByTagName('li');

      for(var i=0;i<lis.length;i++){

         lis[i].onmouseover=function(){

            startMove(this,400)

         }

         lis[i].onmouseout=function(){

            startMove(this,200)

         }

      }

   }

   var timer=null;

   function startMove(obj,iTarget){

      clearInterval(timer);

      timer=(function(){

         var speed=(iTarget-obj.offsetWidth)/8;

         speed=speed>0?Math.ceil(speed):Math.floor(speed);

         if(obj.offsetWidth==iTarget){

            clearInterval(timer);

         }

         else{

            obj.style.width=obj.offsetWidth+speed+'px';

         }

      },30)

   }

   </script>

 </head>

<body>

   <ul>

      <li></li>

      <li></li>

      <li></li>

   </ul>

</div>

</body>

</html>


正在回答

2 回答

首先你的

 

  function startMove(obj,iTarget){

      clearInterval(timer);

      timer=(function(){

         var speed=(iTarget-obj.offsetWidth)/8;

         speed=speed>0?Math.ceil(speed):Math.floor(speed);

         if(obj.offsetWidth==iTarget){

            clearInterval(timer);

         }

         else{

            obj.style.width=obj.offsetWidth+speed+'px';

         }

      },30)

   }

这一段,你的setInterval没写,而且要注意需要给每一个obj定义一个定时器,所以应该写成obj.timer=setInterval(function(){},30),两个clearInterval(timer);也应该写成clearInterval(obj.timer);

另外在你的for循环里面你没给每一个子标签定义一个定时器,应该加一行

for(var i=0;i<lis.length;i++){

         lis[i].timer=null;(注意这个地方timer是给lis[i]的一个属性,所以不需要定义成变量,不用在前面加 var)

         lis[i].onmouseover=function(){

            startMove(this,400)

         }

         lis[i].onmouseout=function(){

            startMove(this,200)

         }

      }

重新回答一次,这里面下划线的是错误代码,粗体是正确代码,你自己对比看看

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

Mycat_ 提问者

非常感谢!
2016-08-06 回复 有任何疑惑可以回复我~

首先你的

 

  function startMove(obj,iTarget){

      clearInterval(timer);

      timer=(function(){

         var speed=(iTarget-obj.offsetWidth)/8;

         speed=speed>0?Math.ceil(speed):Math.floor(speed);

         if(obj.offsetWidth==iTarget){

            clearInterval(timer);

         }

         else{

            obj.style.width=obj.offsetWidth+speed+'px';

         }

      },30)

   }

这一段,你的setInterval没写,而且要注意需要给每一个obj定义一个定时器,所以应该写成obj.timer=setInterval(function(){},30),两个clearInterval(timer);也应该写成clearInterval(obj.timer);

另外在你的for循环里面你没给每一个子标签定义一个定时器,应该加一行

or(var i=0;i<lis.length;i++){

         lis[i].timer=null;(注意这个地方timer是给lis[i]的一个属性,所以不需要定义成变量,不用在前面加 var)

         lis[i].onmouseover=function(){

            startMove(this,400)

         }

         lis[i].onmouseout=function(){

            startMove(this,200)

         }

      }


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

举报

0/150
提交
取消

请问我的代码错误哪里!非常感谢!

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