strisce umano animazione all'interno tela

Question

mia jsfiddle: http://jsfiddle.net/yKvuK/

come si può vedere quando l'uomo a piedi l'immagine rimane al suo posto posso cambiare il codice in modo che quando premo lasciato l'immagine cambiare la sua posizione e guardare come è camminare a sinistra e non solo camminare sul posto?

  function update() { 
      canvas.clearRect(0, 0, CanvasWidth, CanvasHeight); 
      if (keydown.left) { 
        CurentPos++; 
        if (CurentPos == ImgNumb) { 
         CurentPos = 0; 
        } 
      } 
     } // end update 

Answer 1

Prova questa violino:

http://jsfiddle.net/yKvuK/1/

In pratica, ogni volta che si cambia la cornice, la variabile "left" viene decrementato, per cui egli si muove a sinistra.

// I draw the "init" picture at x=250, so he has more space to walk. 

var left = 250; 

function update() { 
    canvas.clearRect(0, 0, CanvasWidth, CanvasHeight); 
    if (keydown.left) { 
     CurentPos++; 
     if (CurentPos == ImgNumb) { 
      CurentPos = 0; 
     } 
     left -= 5; // <---- 
    } 
} // end update 

... 
... 


function draw() { 
    canvas.drawImage(characterImg, CurentPos * 64, 0, 64, 64, left, 200, 64, 64); 
} 

---

btw, non ho mai visto/lavorato con una tela. Sembra che ero solo la fortuna di scegliere la variabile a destra: P

Answer 2

Questo funziona: FIDDLE

Usa il tuo x variabile (invece di aggiungere nuovo) e si sarà in grado di usarlo sul movi- movimento giusto anche. Aggiungilo in update().

if (keydown.left) { 
    CurentPos++; 
    x -= 3; // I used 3 but increase this to move faster 
    if (CurentPos == ImgNumb) { 
     CurentPos = 0; 
    } 
} 

e

canvas.drawImage(characterImg, CurentPos * 64, 0, 64, 64, 200 + x, 200, 64, 64);