Demo page

Sprites.js is simple canvas sprites animation library. No setTimeout() or setInterval(). Just rAF. 774 bytes gzipped. 1,56KB minified. Read docs on Github
Input image

This image has no paddings. It contains 8 frames.

Sprite init

          var parrot = new Sprite({
            src: 'img/papuga.png',
            id: 'canvas',
            width: 160,
            height: 156,
            image_width: 1280,
            err: true
          });
        

Note: Works only for one canvas.

.play(fps, from, to, n)

        
        //Play from 8th to 1st frame (backwards) 5 times. 
        //Open console.log to see callback effects.        
          parrot.play({
            fps: 10, 
            from: 8,
            to: 1, 
            n: 5,
            step: function(e){
              console.log('step:', e);
            },
            loop: function(e){
              console.log('loop:', e);
            }
          });
          
.pause()

                
          parrot.pause();                
        
.reset(5)


        //reset to 5th frame
          parrot.reset(5);
        
.frame()


            alert(parrot.frame());