为什么都需要用到,定时器呢,

来源:4-1 JS多物体动画

慕粉3770264

2016-08-29 09:58

为什么都需要用到,定时器呢,,

写回答 关注

2回答

  • yanbxiaio
    2016-08-29 13:23:59
    已采纳

    定时器不断刷新,每30ms刷新一次,就调用一次函数,运动的过程是宽高(等等想要的效果)变化的过程,调用函数改变宽高,达到运动效果,30ms刷新一次是因为,人眼能识出卡顿的最低帧数是30左右,因此30ms约等于30fps。

    慕粉3770...

    非常感谢!

    2016-08-29 14:01:33

    共 1 条回复 >

  • 慕粉3770264
    2016-08-29 14:00:20

    帮我看看哪里有问题呗

    <script>
    //多物体运动
    window.onload=function(){
        var li=document.getElementsByTagName('li');
        for(var i=0;i<li.length;i++){
            li[i].onmouseover=function(){
            startMove4(this,400);
            }
        li[i].onmouseout=function(){
            startMove4(this,200);
            }
            }
        
        }
        var timer=null;
        function startMove4(obj,iTarget4){
            clearInterval(timer);
            timer.setInterval(function(){
                speed4=(iTarget4-obj.offsetWidth)/8;
                speed4=speed4>0?Math.ceil(speed4):Math.floor(speed4);
                if(obj.offsetWidth==iTarget4){
                    clearInterval(timer);
                    }
                else{
                    obj.style.width=obj.offsetWidth+speed4+'px';
                    }
                },30)
            }
    </script>
    </head>

    <body>
    <ul>
      <li></li>
      <li></li>
      <li></li>
    </ul>

    _莫忘初衷_

    timer.setInterval改成timer=setInterval

    2016-09-17 13:29:23

    共 1 条回复 >

JS动画效果

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

113925 学习 · 1443 问题

查看课程

相似问题