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

怎么动不了啊

<!doctype html>
<html>
<head>
   <meta charset="utf-8">
   <title>无标题文档</title>
   <style type="text/css">
       *{ margin:0; padding:0;}
       #box_main{
           position:relative;
           width:200px;
           height:600px;
           background:#000000;
           left:-200px;}
       #list{  position:relative; left:200px;top:250px; background:#000000; color:#FFFFFF; width:50px;}
   </style>
   <script>
       window.onload=function() {
           var oDiv = document.getElementById('box_main');
           oDiv.onmouseover = function(){
               startMove(0);
           };
           oDiv.onmouseover = function(){
               startMove(-200);
           }
       };
           var timer=null;
           function startMove(Target){
               var oDiv=document.getElementById('box_main');
               timer=setInterval(function(){
                   var speed=0;
                   if(oDiv.offsetLeft<Target){
                       speed=-10;
                   }else{
                       speed=10;
                   }
               if(oDiv.offsetLeft==Target){
                   clearInterval(timer);
               }else {
                   oDiv.style.left = oDiv.offsetLeft + speed + 'px';
               }
                   },30)
           }
   </script>
</head>

<body>
<div id="box_main">
   <span id="list">分享</span>
</div>
</body>
</html>

正在回答

2 回答

补充楼上 在27行function startMove(Target){  后加上 clearInterval(timer);

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

22行onmouseout

31行oDiv.offsetLeft>Target

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

举报

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

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

进入课程

怎么动不了啊

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