Is there a JavaScript physics library that works with HTML elements such as divs rather than in canvas?

Question

I am working on a simple stack for a game where players move numbered pieces around to keep track of how close they are to finishing collecting a winning hand of pieces.

Currently I went with jQuery UI's draggable and droppable. It is good for starting easily but pieces can be moved only one piece at a time: http://cssdeck.com/labs/cowmmudd/4.

• I would like to outsource moving pieces around to a real JavaScript physics library rather than using jQuery UI. (So that when one moves the blue 4 in the upper row all the way left, it forces all pieces on that row together.)
• I want to continue using normal HTML elements to represent my pieces as these are easier to style and reason about. (All the Javascript physics libraries I have taken a look at use canvas but I want to achieve te same as Google once did: http://mrdoob.com/projects/chromeexperiments/google-gravity/)

Can someone provide a minimalistic example of controlling placement and collisions of normal, not-in-canvas HTML elements using the best JavaScript physics library they know of?

Answer 1

The simplest example I have found so far: http://bl.ocks.org/3411189

Update: A simple adaptation to my pieces: http://cssdeck.com/labs/fe3z2cfx/6