JSFiddle - React, Tailwind, and code Playground
by Ken Watanabe
HTML
<div class="strip"><div class="strip-content" style="background: url('https://moreandmoreltd.com/on-and-on.png') repeat-x;"></div></div>
CSS
body {background:black}
.strip {
overflow: hidden;
width:50%;
height:100px;
}
.strip-content {
height: 560px;
width: 5076px;
animation: slide 5s linear infinite;
}
@keyframes slide{
0%{
transform: translate3d(0, 0, 0);
}
100%{
transform: translate3d(-1692px, 0, 0);
}
}