Javascript图像背景

Question

我在一个正在编辑现有Javascript / HTML5游戏的源代码的小组中，我们正试图将它变成我们自己的游戏，用于学校的小组项目。 我有问题将背景画布更改为我找到的图像。 据我所知，这是在现有代码中创建画布的所有代码。

    var CANVAS_WIDTH = 320;
    var CANVAS_HEIGHT = 300;

    var canvasElement = $("<canvas width='" + CANVAS_WIDTH + 
      "' height='" + CANVAS_HEIGHT + "'></canvas");
    var canvas = canvasElement.get(0).getContext("2d");
    canvasElement.appendTo('body');

原始源代码来自以下链接： http ： //www.html5rocks.com/en/tutorials/canvas/notearsgame/

这家伙说他正在使用jquery作为画布。 我不知道这有什么影响。 基本上，我只是想将游戏的背景图像更改为空间或空间图片。 任何帮助将不胜感激，谢谢！

Answer 1

你可以使用css为画布添加背景，如下所示：

<style type="text/css" media="screen">
canvas, img { display:block; margin:1em auto; border:1px solid black; }
canvas { background:url(spacebackground.jpg) }
</style>

希望它能帮到你！ 有关详细信息，请转到此其他堆栈溢出帖子： 如何将html 5画布的背景图像设置为.png图像