0

Canvas のアニメーションについて理解しようとしていますが、何らかの理由でこのコードが機能しません。黄色の四角形が表示されますが、位置は繰り返されません。このスクリプトは<script src = "images/drawing.js"></script>、私の html コードのように参照されます。ここに drawing.js があります:

 var x = 400;
 var y = 300;

 function init() {

     var canvas = document.getElementById("canvas");
     var context = canvas.getContext("2d");
     canvas.width = 800;
     canvas.height = 600;

     context.fillStyle = "black";
     context.fillRect(x,y,150,150);
     setInterval(animateBox(context), 30);

 }



 function animateBox(context) {

     context.clearRect(0,0,context.canvas.width,context.canvas.height);
     x += 5;
     context.fillStyle = "yellow";
     context.fillRect(x,y,150,150);
 }
4

1 に答える 1

1

Change setInterval(animateBox(context), 30); to 

setInterval(function(){
    animateBox(context)
}, 30);

I think that is the problem. The question is kinda vague. Ensure you are calling the init() function too (though you probably are).

于 2013-02-18T22:08:48.270 に答える