aimate javascript frame

Question

Я хочу анимировать спрайт всего 4 кадра в html Canvas. Я наткнулся на такой метод, как ниже. Исходя из фона AS3 и C#, мне действительно не понравился приведенный ниже код, так как он сложный. Я буду здесь часами, пытаясь работать с этим кодом. Есть ли более простой способ анимировать несколько кадров или просто JS «старый».

http://codeutopia.net/blog/2009/08/21/using-canvas-to-do-bitmap-sprite-animation-in-javascript/

Answer 1

это может помочь вам: http://creativejs.com/2012/01/day-11-sprite-sheets/

это в основном петля называется каждые х мс, очищая полотно и рисует новое изображение из последовательности

Answer 2

Посмотрите на эту библиотеку http://www.spritely.net/documentation/ , он прост в использовании, вот пример

http://jsfiddle.net/VxMwN/

$('#bird') 
    .sprite({ 
    fps: 9, 
    no_of_frames: 3 
}) 
    .spRandom({ 
    top: 50, 
    bottom: 200, 
    left: 300, 
    right: 320 
});