css3steps

请问这种一张图片上显示连续的动作是怎么做的

多张图片连续切换就"动"起来了, 很多动效都是这么做的, 例如一些点赞的小动效:由多"帧"的图片的在一起快速切换来实现, 这里面其实js不用做太多的工作, 只负责触发动画的动作就行, 主要是 css animation 在处理图片的移动. 而所有的图片在一起就比如下面这样:具体实现其实就是把这个长条图片从左向右快速滚动, 视觉上就是一个连贯的动效了.另外要注意 animation steps 能跟帧数匹配, 保持每一帧的图片都在同一个画面里上就可以了, 不然会出现鬼畜的感觉.比起用gif图片带来的体积过大和gif播放的问题. 这么做的好处是实现简单体积小, 动画还可控, 只需要一些图片就可以实现效果很棒的小动效.