关键帧动画转换未在 chrome 中运行

【问题标题】：keyframe animation transform not running in chrome关键帧动画转换未在 chrome 中运行
【发布时间】：2015-06-27 20:23:03
【问题描述】：

以下内容似乎适用于 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% {

【问题讨论】：

标签： css google-chrome css-animations

【解决方案1】：

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

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

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

更新

I'm sure – example

【讨论】：

由于某种原因这对我不起作用！你确定它适用于转换吗？
@keyframes 支持现在当然caniuse.com/#search=keyframes（对于任何未来的谷歌员工）