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

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

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

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

<强>更新

I'm sure - example

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

1 个答案: