JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://www.snorkl.tv/dev/libs/greensock/TweenMax.min.js"></script>
<script src="http://www.snorkl.tv/dev/libs/greensock/plugins/ColorPropsPlugin.min.js"></script>
<div id="imgHolder"></div>
CSS
#imgHolder{
width:600px;
height:700px;
background: url('http://www.snorkl.tv/dev/imagestrip.png') no-repeat
}
body{
background-color:#000;
}
JavaScript
//mouseover and mouseout image to speed up and slow down
var img = $('#imgHolder');
var imgTween = TweenLite.to(img, 7, {css:{backgroundPosition:'-1750px'}, ease:Linear.easeNone});
imgTween.timeScale(0);
img.mouseover(function(){
TweenLite.to(imgTween, .5, {timeScale:1});
});
img.mouseout(function(){
TweenLite.to(imgTween, 1, {timeScale:0});
});