为什么结果没出来，都没有反应-慕课网

为什么结果没出来，都没有反应

来源：2-1 JS速度动画

周木杉

2015-12-16 10:00

<!DOCTYPE html>
<html>
<head>
   <meta charset="UTF-8">
   <title>JS动画2</title>
<style type="text/css">
*{margin: 0;
padding: 0;
}
#share{
   width: 200px;
   height: 200px;
   background-color:#11FA45 ;
    position: relative;
    left: -200px;
}
#share span{
   width: 60px;
   height: 50px;
   line-height: 50px;
   background-color: #F36812;
   position: absolute;
    text-align: center;
    top:100px;
    right: -60px;
}
</style>
</head>
<body>
   <div id="share">
        <span>分享</span>
    </div>

<script type="text/javascript">
   window.onload=function(){
   var move=document.getElementById("share");
   move.onmouseover=function(){
       startmove();
   }
}
var timer=null;
function startmove(){
   clearInterval(timer);
   var move=document.getElementById("share");
   timer=setInterval(function(){
       if (move.offsetLeft>=0) {
          clearInterval(timer);
       } else{
           move.style.left=move.offsetLeft+10+'px';}
       },30)
       }

</body>
</script>
</html>

写回答关注

4回答

一毛钱

2015-12-16 10:13:07

已采纳

</body>
</script>这块写错了，应该是
</script>
</body>

2 0

周木杉

非常感谢！

2015-12-16 10:22:00

共 2 条回复 >
A潜水的鱼

2016-01-13 16:09:16

将</body>和</script>两个标签互换就可以了

0 0
A潜水的鱼

2016-01-13 16:05:58

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>JS动画2</title>
<style type="text/css">
*{margin: 0;
padding: 0;
}
#share{
    width: 200px;
    height: 200px;
    background-color:#11FA45 ;
    position: relative;
    left: -200px;
}
#share span{
    width: 60px;
    height: 50px;
    line-height: 50px;
    background-color: #F36812;
    position: absolute;
    text-align: center;
    top:100px;
    right: -60px;
}
</style>
</head>
<body>
    <div id="share">
        <span>分享</span>
    </div>

<script type="text/javascript">
    window.onload=function(){
    var move=document.getElementById("share");
    move.onmouseover=function(){
        startmove();
    }
   move.onmouseout=function(){
        startmout();
    }
}
var timer=null;
function startmove(){
    clearInterval(timer);
    var move=document.getElementById("share");
    timer=setInterval(function(){
        if (move.offsetLeft>=0) {
             clearInterval(timer);
         } else{
            move.style.left=move.offsetLeft+10+'px';}
         },30)
        }
</script>
</body>

</html>

0 0

lynhao: 2015-12-16 10:15:22

你的body的问题，把结束标签提出去

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

</body>

<script type="text/javascript">
   window.onload=function(){
      var move=document.getElementById("share");
      move.onmouseover=function(){
         startmove();
      }
   }
   var timer=null;
   function startmove(){
      clearInterval(timer);
      var move=document.getElementById("share");
      timer=setInterval(function(){
         if (move.offsetLeft>=0) {
            clearInterval(timer);
         } else{
            move.style.left=move.offsetLeft+10+'px';}
      },30)
   }
</script>

0 0

JS动画效果

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

113923 学习 · 1443 问题

查看课程

相似问题

为什么我的毫无反应呢？？半天都没找出来。

回答 1

为什么没反应啊

回答 2

为什么宽高没有反应？透明度却有反应？

回答 1

为什么我的没有结果

回答 2

为什么总是没什么反应？

回答 1

打开慕课网App查看更多内容