0

我试图让我的 Sprite 出现,因为我正在使用带有 HTML5 的 Javascript 制作游戏。这在前一段时间对我有用,但现在它停止工作了,所以我决定再次重写脚本 - 它仍然不起作用。不确定问题出在哪里,但这里是 Javascript 代码,然后是 HTML 代码。谢谢!另外 - 我正在使用 Chrome。Sprite 之前已经出现在 Chrome 互联网浏览器中。

Javascript代码:

var canvasBg = document.getElementById('canvasBg');
var ctxBg = canvasBg.getContext('2d');
var clearCanvasBtn = document.getElementById('clearCanvasBtn');
clearCanvasBtn.addEventListener('click',clearCanvas,false);

var gameWidth = canvasBg.width;
var gameHeight = canvasBg.height;

var imgSprite = new Image();
imgSprite.src = 'sprite.png';
imgSprite.addEventListener('load',drawBg,false);

function drawBg() {
var srcX = 0;
var srcY = 0;
var drawX = 0;
var drawY = 0;
ctxBg.drawImage(imgSprite,srcX,scrY,gameWidth,gameHeight,drawX,drawY,gameWidth,game    Height); 

}
function clearCanvas() {
ctxBg.clearRect(0,800,500); 
}`

HTML 代码...:

` Youtube HTML5 游戏开发教程

<button id="clearCanvasBtn" type="button">Clear Canvas</button>
<canvas id="canvasBg" width="800px" height="500px"                           style="display:block;background:#ffffff;margin:100px auto 0px;"></canvas>;
<script src="game tester.js"></script>

`

4

1 回答 1

0

你没有说“停止工作”是什么意思,但是......

Chrome 在创建 Image 对象时出现了一个新错误

因此,如果您的代码之前运行良好,但在 Chrome 更新后失败,请尝试以下操作:

// instead of new Image()
var imgSprite = document.createElement("img");
于 2013-06-17T20:27:39.173 回答