JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://rawgithub.com/blaiprat/jquery.animateSprite/master/scripts/jquery.animateSprite.js"></script>
<a class='stop'>stop</a>
<a class='start'>start</a>
<div class='scott'></div>
<div class='girl'></div>

CSS

.scott {
    background: url(http://blaiprat.github.io/jquery.animateSprite/img/scottpilgrim_multiple.png);
    width: 108px;
    height: 140px;
}

.girl {
    background: url(https://simply4all.net/demos/animatesprite/animation-girl.jpg);
    width: 210px;
    height: 320px;
}
}

JavaScript

$('.scott').animateSprite({loop:true, fps:12, totalFrames: 16, autoplay: false});

$('.girl').animateSprite({loop:true, fps:12, autoplay: false});

$('.stop').click(function() {
    $('.scott, .girl').animateSprite('stopAnimation');
});
$('.start').click(function() {
    $('.scott, .girl').animateSprite('play');
});