CSS:抱歉，at-rule @keyframes 未实现

Question

尝试使用 http://www.w3schools.com/cssref/tryit.asp?filename=trycss3_keyframes2 中的示例制作简单的动画作为引用

但是，我尝试制作动画的图像静止不动。 Aptana 编辑器吐出这些错误 - “属性动画不存在，”属性动画迭代计数不存在，“抱歉，at-rule @keyframes 未实现”。

我的 html:

<div id="animate"><img src="flower.jpg"> </div>

我的CSS:

#animate img 
{
    width:50px;
    height:50px;
    animation: test 25s;
    animation-iteration-count: 10;
    -moz-animation: test 25s;
}

@keyframes test
{
0%   {left:0px; top:0px;}
25%  {left:200px; top:0px;}
50%  {left:200px; top:200px;}
75%  {left:0px; top:200px;}
100% {left:0px; top:0px;}
}

@-moz-keyframes test
{
0%   {left:0px; top:0px;}
25%  {left:200px; top:0px;}
50%  {left:200px; top:200px;}
75%  {left:0px; top:200px;}
100% {left:0px; top:0px;}
}

第三个错误，“抱歉，at-rule @keyframes is not implemented” - 这是否意味着此功能未在全局范围内正式实现？如果是这样，为什么 W3schools 上的示例代码可以正常工作，但我的编辑器中的代码却不起作用？

在 Windows 上使用 Mozilla 18.0.2

Answer 1

这似乎对我有用。我添加了一个包含类只是为了确定。

http://codepen.io/anon/pen/JBdgk

此外，您只编写了 moz 关键帧。您正在 Firefox 中对此进行测试，对吗？