javascript - 游戏里面背景移动的原理是什么？

问题描述

比如人向前走，背景向后，切换画布

问题解答

实现的原理可以有很多，根据游戏的主题和内容会有所差异。我所知道的常见比较好实现的：1、设置一张背景图，平铺游戏主体区域大小，设置background-repeat为repeat，通过定时器改变该图片的background-position的坐标即可实现（例如微信上的打飞机游戏的背景）。2、此外还有一些背景相对复杂的可采用一个子容器内含有多张背景图无间隙拼接，针对父容器做相对定位，移动即改变子容器的top、left值等（类似于轮播图的原理），因为人向前走实际上只是“人”这个层级在限定区域内活动，同时地面和背景在另一相同的层级往人的相反方向定位移动的效果所产生的。

我第一印象是超级玛丽这种2D游戏，它的背景并不是二方连续的，左右方向，我觉得最笨的办法就是那个2D背景很长很长，然后摄像机一直往前推进，哈哈。