SpriteClip.js is a jQuery plugin that makes it easy to make snazzy frame-by-frame animations like this by emulating the functionality of the MovieClip class in ActionScript 3.0.
It works by animating the background-image property of a dom node where the “frames” are spaced out equally. Eg. if the sprite is laid out horizontally and each frame is 20px wide, frame 1 will be at background-position: 0 0 and frame 2 will be at background-position: -20px 0
