chrome 中的关键帧动画转换不是 运行

Question

以下似乎适用于 Firefox 和 Safari，甚至 IE！但是不是 Chrome.

（适用于 Firefox 和 IE，但如果您在 Chrome 中打开它，您什么​​也看不到！）

@keyframes animationFrames{
  0% {
    transform:  translate(-402px,55px)  ;
  }
  4% {
    transform:  translate(-333px,26px)  ;
  }
  9% {
    transform:  translate(-257px,-13px)  ;
  }
  14% {

Answer 1

那是因为@keyframes 规则是 not supported Chrome。您必须使用带前缀的规则 @-webkit-keyframes，例如：

/* Chrome, Safari, Opera */ 
@-webkit-keyframes animation {
    0% { }
    100% { }
} 

/* Standard syntax */ 
@keyframes animation {
    0% { }
    100% { }
}

更新

I'm sure – example