1264548 - css3 animation to change background image

Status: UNCONFIRMED

(Core :: CSS Parsing and Computation, defect)

Description

[priya]

User Agent: Mozilla/5.0 (X11; Linux i686) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/47.0.2526.106 Safari/537.36

Steps to reproduce:

I am trying to animate the background image of my div using css3 keyframes animation. Below is my code:
@-moz-keyframes wrapFadeInOut {
        0% {
            background: url(../images/landing_page_backgrounds/Collages.jpg) no-repeat 0% 0%/cover;
        }
        33% {
            background: url(../images/landing_page_backgrounds/Collages1.jpg) no-repeat 0% 0%/cover;
        }
        66% {
            background: url(../images/landing_page_backgrounds/Collages2.jpg) no-repeat 0% 0%/cover;
        }
        100% {
            background: url(../images/landing_page_backgrounds/Collages.jpg) no-repeat 0% 0%/cover;
        }
    }

    #wrap {
           -webkit-backface-visibility: hidden;
           -moz-backface-visibility: hidden;
           -ms-backface-visibility: hidden;
           backface-visibility: hidden;

            -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
       -ms-transform: translate3d(0, 0, 0);
       transform: translate3d(0, 0, 0);
        animation-name: wrapFadeInOut;
        -webkit-animation-name: wrapFadeInOut;
        animation-iteration-count: infinite;
        -webkit-animation-iteration-count: infinite;
        -webkit-animation-timing-function: ease-in;
        animation-duration: 15s;
        -webkit-animation-duration: 15s;
        width:100vw;
        height: 100vh;
        overflow-x: hidden;
    }


Actual results:

this animation is working fine with webkit enabled browsers but its not working for mozilla only. It does not show any background image. If i change to background color, it works fine in mozilla. does mozilla still not supports background image animations

Comment 1

[Loic]

Could you attach a testcase to the bug report, please (or on http://codepen.io/ eg).

Comment 2

[priya]

I have created a coodepen 
http://codepen.io/priyarvyas/pen/qZoedW