Html 当我向右移动角色时,如何逐帧迭代多个精灵?

Html 当我向右移动角色时,如何逐帧迭代多个精灵?,html,sprite,ranged-loops,Html,Sprite,Ranged Loops,我以前从未做过html5游戏,我为一个简单的交叉游戏做过一些精灵。我想让我的角色在向右移动时使用一个由四个不同的精灵帧组成的数组,然后循环直到最后一个,直到我停止移动,在那里,它会反转循环并循环回原始精灵帧。 我想有一个左右移动的功能。我想要相同的功能,但当向左移动时,精灵会朝相反的方向移动。 如果我的角色与敌人的精灵相撞,我希望每个方向的第五个精灵帧触发,并在游戏结束时保持精灵。这是一个关于精灵的游戏,有两个存在,当玩家与敌人碰撞时,每个方向一个。玩家的精灵总数为10,每个方向5个,每个方向使

我以前从未做过html5游戏,我为一个简单的交叉游戏做过一些精灵。我想让我的角色在向右移动时使用一个由四个不同的精灵帧组成的数组,然后循环直到最后一个,直到我停止移动,在那里,它会反转循环并循环回原始精灵帧。 我想有一个左右移动的功能。我想要相同的功能,但当向左移动时,精灵会朝相反的方向移动。 如果我的角色与敌人的精灵相撞,我希望每个方向的第五个精灵帧触发,并在游戏结束时保持精灵。这是一个关于精灵的游戏,有两个存在,当玩家与敌人碰撞时,每个方向一个。玩家的精灵总数为10,每个方向5个,每个方向使用4个,除非在触发特定方向的第五个方向时发生碰撞

敌方精灵只有两个画面,在游戏结束前,它们会不断循环

最后一帧用于目标,这是一个不变的静态帧

我怎样才能做到这一点


我是新来的,所以我不知道是否应该或如何准确地构建一个数组来循环每个方向的图像,或者是否应该为循环或if循环或每个循环执行一些操作?

要从递增的数字中获取循环索引,请使用模运算符:

sprite_index = step_number % 4
然后,sprite_索引将是0,1,2,3,0,1,2,3,0,1,2,3,。。。当步数增加时,如0,1,2,3,4,5,6,7,8,9,10,11

不要使用循环,因为你已经有了一个循环来移动角色等等。内部的一个额外循环将在主循环运行时停止主循环