3

私の Web サイトには 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('')
4

3 に答える 3

3

仕様の最新のワーキング ドラフト(2015 年 8 月 14 日) によると、background-imageアニメーション化不可と定義されています。

それから、Firefox は仕様に従っているだけであり、アニメーションするブラウザの動作background-imageは非標準であり、依存するべきではありません。

于 2014-02-24T13:22:45.940 に答える
2

背景画像間を補間する機能は、これまでのところかなり新しい提案であり、ブラウザーでは十分にサポートされていません。Firefox はまだ実装していません。

于 2013-07-22T01:45:28.210 に答える