怎么没有效果，就赐教，谢谢-慕课网

怎么没有效果，就赐教，谢谢

来源：2-1 JS速度动画

2016IT精英

2017-03-20 19:42

<!DOCTYPE html>
<html>
   <head>
       <meta charset="utf-8" />
       <title></title>
       <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 type="text/javascript">
       window.onload=function(){
           var oDiv=document.getElementById('div1');
           oDiv.onmouseover=function{
               startMove(0);
           }
           oDiv.onmouseout=function(){
               startMove( -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>
</html>