0
Javascript Canvas에로드 된 이미지가 오른쪽으로 슬라이드하는 아주 간단한 애니메이션을 얻으려고합니다. 다음 코드는 그려진 사각형과 함께 작동하지만 이미지를 삽입하려고하면 아무것도로드되지 않지만 오류 메시지는 표시되지 않습니다. Javascript만으로 작업 할 필요가 있습니다.자바 스크립트 캔버스에서 이미지 이동
window.requestAnimFrame = (function(){
return window.requestAnimationFrame ||
window.webkitRequestAnimationFrame ||
window.mozRequestAnimationFrame ||
window.oRequestAnimationFrame ||
window.msRequestAnimationFrame ||
function(callback){
window.setTimeout(callback, 1000/60);
};
})();
var canvas = document.getElementById("canvas"),
cx = canvas.getContext("2d");
function Card(x,y){
this.x = x || 0;
this.y = y || 0;
this.draw = function(){
var img = new Image();
img.onload = function()
{
cx.drawImage(img, x, y);
}
img.src = "images/back.jpg";
}
}
var myCard = new Card(50,50);
function loop(){
cx.clearRect(0, 0, canvas.width, canvas.height);
myCard.x++;
myCard.draw();
requestAnimFrame(loop);
}
loop();