JSFiddle - React, Tailwind, and code Playground

by kiokotzu

HTML

<img src="http://larealpari.com/_/img/foto2.jpg" alt=""/>
<div class="video"></div>

CSS

.video {
    width: 534px;
    height: 300px;
    background-image: url("http://larealpari.com/_/img/foto2.jpg");
   
    -webkit-animation: video 3s steps(40) infinite;
       -moz-animation: video .8s steps(40) infinite;
        -ms-animation: video .8s steps(40) infinite;
         -o-animation: video .8s steps(40) infinite;
            animation: video .8s steps(40) infinite;
}
@-webkit-keyframes video {
   from { background-position:    0px; }
     to { background-position: -21360px; }
}

@-moz-keyframes video {
   from { background-position:    0px; }
     to { background-position: -500px; }
}

@-ms-keyframes video {
   from { background-position:    0px; }
     to { background-position: -500px; }
}

@-o-keyframes video {
   from { background-position:    0px; }
     to { background-position: -500px; }
}

@keyframes video {
   from { background-position:    0px; }
     to { background-position: -500px; }
}