JSFiddle - React, Tailwind, and code Playground

by ZachWills

HTML

<div class="walker">

</div>

CSS

.walker {
background-image:url('http://atomicrobotdesign.com/blog_media/sprite_movement/images/gb_walk.png');
height:150px;
 width:90px;   
}

JavaScript

forwardAnim = new Array("-22px", "-122px", "-209px", "-340px", "-433px", "-520px");
console.log(forwardAnim);
x = 0;
setInterval(function() {
    if (x == 6) {
        x = 0;
    }
    console.log(forwardAnim[x]);
    $(".walker").css({
        'background-position-x': forwardAnim[x]
    });
    x++;
}, 150);