js动画效果显示不出来

来源:2-1 JS速度动画

qq_耿阳阳_0

2016-11-16 17:12

老师,为什么我的显示不了动画效果

写回答 关注

5回答

  • qq_耿阳阳_0
    2016-11-18 16:19:59

    对了,太感谢

  • Lemon156
    2016-11-17 10:03:25

    你代码中两个地方有错误

    在startMove函数中没有获取到id为did的div

    在给oDiv.style.width赋值的时候要加上px,因为oDiv.style.width是有带单位的

    下面是我改过来的代码

    <script type='text/JavaScript'>
    window.onload=function(){
    var oDiv=document.getElementById("did");
    oDiv.onmouseover=function(){
    startMove(400);
    }
    }
    var timer=null;
    function startMove(object){
    var oDiv=document.getElementById("did");
    clearInterval(timer);
    timer=setInterval(function(){
    var speed=0;
    if(oDiv.offsetWidth>object){
    speed=-10;
    }
    else{
    speed=10;
    }
    if(oDiv.offsetWidth==object){
    clearInterval(timer);
    }
    else{
    oDiv.style.width=oDiv.offsetWidth+speed+'px';
    }
    },30)
    }
    </script>


  • qq_耿阳阳_0
    2016-11-16 17:43:59

    我鼠标放上去,没有任何变化


  • qq_耿阳阳_0
    2016-11-16 17:41:31

    这是我写的代码:

    <style>

    *{

      margin:0;

      padding:0;

    }

    #did{

    width:200px;

    height:200px;

    background:red;

    top:0px;

    }

    </style>

    <script type='text/JavaScript'>

    window.onload=function(){

    var oDiv=document.getElementById("did");

    oDiv.onmouseover=function(){

    startMove(400);

    }

    }

    var timer=null;

    function startMove(object){

    clearInterval(timer);

    timer=setInterval(function(){

    var speed=0;

    if(oDiv.offsetWidth>object){

    speed=-10;

    }

    else{

    speed=10;

    }

    if(oDiv.offsetWidth==object){

    clearInterval(timer);

    }

    else{

    oDiv.style.width=oDiv.offsetWidth+speed;

    }

    },30)

    }

    </script>


  • zhbit_hsj
    2016-11-16 17:28:42

    问题能具体点吗

JS动画效果

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

113931 学习 · 1443 问题

查看课程

相似问题