即使有前缀，CSS3动画也无法在Firefox上运行，但适用于Chrome和Safari

Question

我的以下代码适用于chrome和safari但不适用于Firefox。我尝试使用前缀而没有它们，似乎有些人认为你在Firefox中不需要它们。 Firefox网站称仍然接受前缀。

提前致谢。

.wiggle{
     -webkit-animation: wiggleMe .3s ease infinite;
     -moz-animation: wiggleMe .3s ease infinite;
     -o-animation: wiggleMe .3s ease infinite;
     animation: wiggleMe .3s ease infinite;
    }



@-webkit-keyframes wiggleMe {
   from{-webkit-transform: rotateY(2deg);}
   from{-moz-transform: rotateY(2deg);}
   from{transform: rotateY(2deg);}
   50%{-webkit-transform: rotateY(-2deg);}
   50%{-moz-transform: rotateY(-2deg);}
   50%{transform: rotateY(-2deg);}
   to{-webkit-transform: rotateY(2deg);}
   to{-moz-transform: rotateY(2deg);}
   to{transform: rotateY(2deg);}
   }

++++ update ++++++ 所以我修改了上面的代码并基于其他一些响应做了这个，遗憾的是还没有工作。

@-webkit-keyframes wiggleMe {
  from{-webkit-transform: rotateY(2deg);}
  50%{-webkit-transform: rotateY(-2deg);}
  to{-webkit-transform: rotateY(2deg);}
  from{-moz-transform: rotateY(2deg);}
  50%{-moz-transform: rotateY(-2deg);}
  to{-moz-transform: rotateY(2deg);}
  from{transform: rotateY(2deg);}
  50%{transform: rotateY(-2deg);}
  to{transform: rotateY(2deg);}
}
@-moz-keyframes wiggleMe {
  from{-webkit-transform: rotateY(2deg);}
  50%{-webkit-transform: rotateY(-2deg);}
  to{-webkit-transform: rotateY(2deg);}
  from{-moz-transform: rotateY(2deg);}
  50%{-moz-transform: rotateY(-2deg);}
  to{-moz-transform: rotateY(2deg);}
  from{transform: rotateY(2deg);}
  50%{transform: rotateY(-2deg);}
  to{transform: rotateY(2deg);}
}
@keyframes wiggleMe {
  from{-webkit-transform: rotateY(2deg);}
  50%{-webkit-transform: rotateY(-2deg);}
  to{-webkit-transform: rotateY(2deg);}
  from{-moz-transform: rotateY(2deg);}
  50%{-moz-transform: rotateY(-2deg);}
  to{-moz-transform: rotateY(2deg);}
  from{transform: rotateY(2deg);}
  50%{transform: rotateY(-2deg);}
  to{transform: rotateY(2deg);}
}

=====功能代码不是最佳的，动画与chrome或safari中的动画并不完全相同，但至少我现在得到了一些东西。完全删除了@keyframe，你可以看到我将50％{rotateY}修改为rotateZ并更改了度数========

@-webkit-keyframes wiggleMe {
  from{-webkit-transform: rotateY(2deg);}
   50%{-webkit-transform: rotateY(-2deg);}
    to{-webkit-transform: rotateY(2deg);}
}
@-moz-keyframes wiggleMe {
  from{-moz-transform: rotateY(0deg);}
   50%{-moz-transform: rotateZ(-1deg);}
    to{-moz-transform: rotateY(0deg);}
}
@-o-keyframes wiggleMe {
  from{-o-transform: rotateY(2deg);}
   50%{-o-transform: rotateY(-2deg);}
    to{-o-transform: rotateY(2deg);}
}