是否有一个JavaScript物理库可以处理诸如div之类的HTML元素，而不是在画布中？

我正在为一个游戏制作一个简单的堆栈，玩家在其中移动带编号的棋子，以跟踪他们离收集一手获胜棋子的距离有多近

目前我使用jQueryUI的可拖动和可拖放功能。这有利于轻松启动，但一次只能移动一个部件：

• 我想将移动部分外包给一个真正的JavaScript物理库，而不是使用jQueryUI。（因此，当一个人将上一行中的蓝色4一直向左移动时，它会将该行中的所有片段强制在一起。）
• 我想继续使用普通的HTML元素来表示我的作品，因为这些作品更易于设计和推理。（我看过的所有Javascript物理库都使用了

  canvas

  ，但我希望实现与谷歌曾经实现的相同的目标：）

---

有人能提供一个最简单的例子，用他们所知道的最好的JavaScript物理库来控制普通的非画布HTML元素的放置和冲突吗？

到目前为止，我发现的最简单的例子是：

---

更新：对我的作品进行简单的改编：

你确定使用额外的外部库是正确的选择吗？如果在跌落时只检查瓷砖的高度是否相同，是否可以将其向左移动，并在那里设置动画，该怎么办？@BenjaminGruenbaum我不想写很多无法维护的代码，因为我在物理、数学和几何方面是一个完全的noob，你可以说。我想声明游戏对象的属性，并有一个适当的库来处理冲突和放置。box2d的JS版本有一个使用画布的调试渲染器，但这只是默认设置。您可以按任何方式渲染对象--模拟和绘图是独立的。这些链接是在没有警告的情况下删除的，还是永久性的固定装置？在大多数情况下，最好在答案中粘贴实际代码，并引用链接。否则，如果资源突然消失，您的答案将变得无用。另见@RobertHarvey：你是对的，我将根据你的建议编辑cssdeck@RobertHarvey：我已经更新了我的答案，嵌入了两个简短的JS片段，并添加了对其原始源代码的引用。下面是另一个看起来很有希望的有趣项目：