Question

我制作了这段代码，使用css3关键帧生成动画背景。这段代码在chrome上完美运行，但它在mozzila firefox中不起作用。所以请帮我解决这个问题。谢谢。

          body
    {
    -webkit-animation: HONIBHICHAYE 15s ease alternate infinite;
    -moz-animation: HONIBHICHAYE 15s ease alternate infinite;
     animation: HONIBHICHAYE 15s ease alternate infinite; 
         background-size:100%;
         background-repeat:no-repeat;
         background-position:50% 50%;
         font-family:"My Custom Font";
    }
    @-webkit-keyframes HONIBHICHAYE
    {
        0%
        {
        background-image:url('../images/1.jpg');
        }
        50%
        {
       background-image:url('../images/2.jpg');
        }
        100%
        {
        background-image:url('../images/3.jpg');
        }
    }
    @-moz-keyframes HONIBHICHAYE
           {
       0%
       {
       background-image:url('../images/1.jpg');
       }
           50%
       {
       background-image:url('../images/2.jpg');
       }
        100%
      {
        background-image:url('../images/3.jpg');
      }
         }
      @keyframes HONIBHICHAYE
          {
        0%
        {
        background-image:url('../images/1.jpg');
}
           50%
        {
         background-image:url('../images/2.jpg');
         }
         100%
        {
            background-image:url('../images/3.jpg');
        }
            }

Answer 1

据我所知，background-image动画不适用于Mozilla Firefox。更改background-color确实有效。

Answer 2

background-image不是有效的可转换属性。它适用于Chrome，但它确实不应该。

css3动画在mozilla firefox中不起作用

2 个答案: