JSFiddle - React, Tailwind, and code Playground

HTML

<div id="tech-slideshow">
    <div id="tech"></div>
</div>

CSS

body:hover
{

-webkit-animation-play-state: paused;
}

#tech-slideshow {
    height: 200px;
    width:600px;
    position: relative;
    overflow: hidden;

}
#tech{
    height: 200px;
    width: 2526px;
    background: url(http://cl.ly/9BJG/collage.jpg);
    position: absolute;
    top: 0;
    left:0;
    height: 100%;
    
    -webkit-animation: moveSlideshow 10s linear infinite;
    -webkit-animation-play-state:paused;
}

@-webkit-keyframes moveSlideshow {
    0% { left: 0; }
    100% { left: -1684px; }
}


#tech:hover{
    -webkit-animation-play-state:running;
}