我的CSS动画中只有一半在FF中运行。所有工作都在Chrome中

Question

我有一个非常简单的动画，可以改变div的背景图像。

@-moz-keyframes slider {
0%   {  background-image: url('../img/slide1.jpg');}
25%  {  background-image: url('../img/slide2.jpg');}
50%  {  background-image: url('../img/slide2.jpg');}
75%  {  background-image: url('../img/slide1.jpg');}
100% {  background-image: url('../img/slide1.jpg');}
}

#mydiv {
height: 400px;
width: 500px;
background-size: cover;

-moz-animation: slider 10s infinite;
}
/*I obviously have the -o-, -webkit- and normal there too, just keeping it short*/

它在Chrome中运行良好，但在Firefox（或IE）中无效。背景只是保持白色。我拥有的其他动画（移动文本和东西）在两者中都可以正常工作，并且它们以相同的方式编写。这个不会。有什么想法吗？