小编典典

Firefox中的CSS3动画和背景图片

css

我的网站上有一些CSS3动画,它在Safari上运行良好,但是当我在Firefox中运行该网站时,它没有动画。这是代码:

.ad{
position:relative;
left:740px;
top:240px;
width:260px;
height:195px;
background-image:url('ad1.png');

animation:myfirst 4s;

-webkit-animation:myfirst 4s; /* Safari and Chrome */
-webkit-animation-delay:2s;
-webkit-animation-duration:0s;
-webkit-animation-fill-mode: forwards;
}

@keyframes myfirst

 {
  from {background-image:url('ad1.png')}
  to {background-image:url('ad2.png')}

 }


@-webkit-keyframes myfirst /* Safari and Chrome */
 {
  from {background-image:url('ad1.png');}
  to {background-image:url('ad2.png');}
 }
}

现在我注意到,当网站点击

 background-image:url('');

如果我将这些更改为

 background:color;

然后就可以了,但是显然我要使用图像。我试过添加-moz-前缀,但是不起作用。我想念什么?有没有办法让Firefox承认

Background-image:url('')

阅读 371

收藏
2020-05-16

共1个答案

小编典典

到目前为止,在背景图像之间进行插值的功能是一项非常新的提议,并且在浏览器中并未很好地支持。Firefox尚未实现。

2020-05-16