使用精灵平滑CSS动画

我试图动画我的精灵，它与此类似。 如果有人能展示如何让它更顺畅，我将不胜感激。 我的精灵中只有3张图像。 延迟1秒，所以过渡非常糟糕。

我试过用：

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

但它没有用。 我真的很感激任何帮助。

Answer 1

尝试添加一些过渡效果，如：

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