Popmotion: A Free 12kb JavaScript Motion Library

Wednesday, October 21, 2015

Pure CSS animation has garnered much attention over the past few years – but similar advances have also been occurring with JavaScript development.

A brand new library named Popmotion is a fully-featured motion library. It contains effects for traditional UI animation, real-world physics simulations, and motion based on user input.

Popmotion is, in short, one hell of a motion library.

The file clocks in around 12kb and contains all the features you could ever need. Popmotion even includes a brief getting started guide for new developers. You’ll find everything from initial setup to running your first animation.

Also check out the Popmotion sandbox on codepen which is free for anyone to edit and toy around with. The official Popmotion CodePen profile also has other examples. worthy of consideration.

The library is fully extensible and includes many features:

Native DOM support: CSS, SVG, SVG path and DOM attribute support, out of the box.
Unlimited: Custom callbacks allow you output to any numerical property or API.
Power anything: Use with jQuery, Canvas, Three.js, WebSockets, etc.
Seamless interaction: Tracks velocity for hand-off between input, animation and physics.
Node support: Run on a server or an Arduino to fuel the IoT.
Open rAF loop: Run any Process on the core requestAnimationFrame loop.

Download a full copy of the Popmotion library on GitHub and get started with dynamic animations in your web projects.

Also you can stay up-to-date with the library’s official Twitter account @popmotionjs.