Smooth CSS animation with sprite

问题

I have tried to animate my sprite and it is similar to this. I would appreciate if someone can show how to make it more smooth. I have only 3 images in my sprite with approx. 1 second delay, so the transition is quite bad.

I've tried to use:

from {
    -webkit-transform: translateX(..);
}
to { 
    -webkit-transform: translateX(..);
}

But it did not work. I would really appreciate any help.

回答1:

try to add some transition effects like :

-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-ms-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;

来源：https://stackoverflow.com/questions/37413746/smooth-css-animation-with-sprite