Javascript 2D侧滚HTML5游戏

我正在尝试用html5制作一个侧滚游戏。我想知道我怎么能有一个500px到500px的视频，但是背景是500px高2000px宽。当查看区域滚动更多的背景出现，但字符停留在中间类似于口袋妖怪游戏是如何。 context.drawImage函数有一大堆参数，您可以给它赋值。您要播放源（图像）

x，y，宽度，高度

和目标（屏幕）

x，y，宽度，高度

。以下是

drawImage

的参数列表

drawImage(image, sx, sy, sw, sh, dx, dy, dw, dh)

因此，下面将绘制从左侧开始的图像

400px

，到从左侧开始的图像

900px

var w = 500;
var h = 500;
var scrollPos = 400;
drawImage(image, scrollPos, 0, w, h, 0, 0, w, h);

进一步阅读

---

在将来，展示您已经尝试过的内容或至少您考虑过的内容是很有帮助的。另外，您可能会考虑更直接地问您的问题，例如“我如何在500 px查看区域创建一个500 px，其中背景是500 px到2000 px？”