CSS3 animazioni di sfondo non funziona su firefox

Question

Ciao ho questo esempio, è un lavoro bene Chrome e Opera, ma non funziona in Firefox

check on fiddle

body { 
    width: 100%; 
    height: 100%; 
    background: url('http://www.picz.ge/img/s2/1505/17/1/1b588904a0d2.png'); 
    -webkit-animation: mymove 10s; 
    /* Chrome, Safari, Opera */ 
    -webkit-animation-iteration-count: infinite; 
    /* Chrome, Safari, Opera */ 
    -moz-animation: mymove 10s; 
    -moz-animation-iteration-count: infinite; 
    animation: mymove 10s; 
    animation-iteration-count: infinite; 
} 
@-webkit-keyframes mymove { 
    from { 
     background: url('http://www.picz.ge/img/s2/1505/17/1/1b588904a0d2.png'); 
    } 
    to { 
     background: url('http://www.picz.ge/img/s4/1505/17/b/b2c36d72aaa6.png'); 
    } 
} 
@-moz-keyframes mymove { 
    from { 
     background: url('http://www.picz.ge/img/s2/1505/17/1/1b588904a0d2.png'); 
    } 
    to { 
     background: url('http://www.picz.ge/img/s4/1505/17/b/b2c36d72aaa6.png'); 
    } 
} 
@keyframes mymove { 
    from { 
     background: url('http://www.picz.ge/img/s2/1505/17/1/1b588904a0d2.png'); 
    } 
    to { 
     background: url('http://www.picz.ge/img/s4/1505/17/b/b2c36d72aaa6.png'); 
    } 
} 

Answer 1

È possibile utilizzare un: elemento pseudo per aggiungere un background-image e cambiare la sua opacità

demo - https://jsfiddle.net/4x3k7Lxy/4/