Question

我想将动画循环排序为JavaScript中的对象。该对象的功能将像这样

var a; var move = new Repeat(10,function(){a++}); 它会以动画速度运行，而不是立即运行。

这是我的原始代码（无效）。

        function obj(id){return document.getElementById(id);}
        function Repeat(fn,rpt){
            this.function = fn;
            this.repeat = rpt;
            this.counter = 0;
            this.id=setInterval(this.start,5);
            this.start = function(){
                if (this.counter == this.repeat) {
                    clearInterval(id);
                } else {
                    this.repeat++;
                    this.function();
                }
            }
        }


        var box = obj('animation');
        var a=0;
        var move = new Repeat(function(){
            a++;
            box.style.top=a+'px';
            box.style.left=a+'px';
        },300);
        move.start();

所以我正在寻找实现这一目标的建议。

Answer 1

也许您可以使用Web动画API来做到这一点，我想它会更容易https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API/Using_the_Web_Animations_API

在JavaScript对象中进行重复的动画循环

1 个答案: