I want the villain to move in place, but he moves forward, and after the frame ends, he will flash to start from scratch. This is too ugly.
what to do with the boss? here is the code
<div class="loading">
<div class="load">
</div>
</div>.loading{
width: 100px;
height: 100px;
background: rgb(0,0,0,0.5);
position: fixed;
top: 35%;
left: 35%;
}
.load{
position: absolute;
background-image: url(/static/img/geijiasheng.png);
background-repeat: no-repeat;
background-position: 0 0;
background-size: 618px 80px;
height: 80px;
width: 64px;
-webkit-animation: sprite 1s steps(10) infinite reverse;
left: 19%;
top: 10%;
}
@-webkit-keyframes sprite {
0% {
background-position:0;
}
100% {
background-position: -768px 0;
}
}