JSFiddle - React, Tailwind, and code Playground

HTML

<div class="thing">I'm a block of text</div>

CSS

@-webkit-keyframes back{
        0% {
    background-position:-300px;
        }
        100% {
        background-position:0;
       }         
      }
.thing{
    display:block;
    height:300px;
    width:300px;
    background:url('http://lorempixum.com/300/300') no-repeat;
    border:1px solid grey;
    -webkit-animation-name: back;
    -webkit-animation-duration:1s;
     -webkit-animation-direction: normal;
    -webkit-animation-timing-function:linear;
    -webkit-animation-play-state:paused;
}

.thing:hover{
    -webkit-animation-play-state:running;
}