Question

我正在尝试让我的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 code ...：

` 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>

`

Answer 1

你没有说什么＆＃34;停止工作＆＃34;意思是，但......

创建图像对象时，Chrome中存在新的错误

因此，如果您的代码之前工作正常但Chrome更新后失败，请尝试以下操作：

// instead of new Image()
var imgSprite = document.createElement("img");

无法加载资源，Javascript，HTML5

1 个答案: