Physics-enabled HTML

This is a pretty pointless, yet very interesting application of standard JavaScript on an HTML page.

All the elements on this page, with the exception of the canvas, are defined in plain HTML, and then physics-enabled through a class library which implements simple mass-spring physics.

The physics engine is completely separated from the presentation layer. All the moving of elements and turning them into obstacles is handled by the DOMRenderer class. The canvas is handled by the CanvasRenderer class, and so on. This makes the engine very flexible.

The engine is free to use, should you come up with something that could make use of it. I made it mostly to train my JavaScript skills, and because I have a weakness for mass-spring physics engines (I know, I'm strange).

Made by Andreas Blixt <>