console
<div class="rest-banner">
<div class="scroll"></div>
</div>
.rest-banner {
overflow: hidden;
display: block;
background: transparent;
background-color: transparent;
height: 30px;
width: 100%;
}
.rest-banner .scroll {
display: block;
background-color: transparent;
background-image: url(http://www.webhek.com/wordpress/wp-content/themes/webhek2016/bg-wave.png);
height: 30px;
width: 200%;
-webkit-animation: scrollGood 20s linear infinite;
animation: scrollGood 20s linear infinite;
}
@-webkit-keyframes scrollGood {
0% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
100% {
-webkit-transform: translate3d(-254px, 0, 0);
transform: translate3d(-254px, 0, 0);
}
}
@keyframes scrollGood {
0% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
100% {
-webkit-transform: translate3d(-254px, 0, 0);
transform: translate3d(-254px, 0, 0);
}
}