我以前从未制作过 html5 游戏，我为一个简单的穿越游戏制作了一些精灵。我想让我的角色在向右移动时使用四个不同的精灵帧的数组，然后循环直到最后一个，直到我停止移动，然后它会反转循环并循环回到原始的精灵帧。我想左右运动都有这个功能。我想要相同的功能，但精灵在向左移动时朝向相反的方向。如果我的角色与敌方精灵发生碰撞，我希望每个方向的第五个精灵帧触发并在游戏结束时保持精灵。这是一个存在两个精灵的游戏，一个对应于玩家在与敌人碰撞时移动的每个方向。玩家的总精灵是 10，
敌人的精灵仅由两帧组成，它们无限循环直到游戏结束。
最后一帧用于目标，它是一个不会改变的静态帧。
我怎样才能使这项工作？
我是新手，所以我不知道我是否应该或如何准确地构建一个数组来循环遍历每个方向的图像，或者我是否应该做一些 for 循环或 if 循环或每个循环？