jQuery / CSS轉換在Firefox中不起作用

Question

我正在網站上的一項功能上，其中的圖像應每5秒更改一次，並過渡到具有褪色效果的另一幅圖像。

我的JavaScript是這樣的

jQuery('.mySlider').css({"background-image" : "url(/images/image1.jpg)"});

var counter = 0;
function setBckImage(){
    if(counter<2){
        counter++;
    } else {
        counter=1;
    }


    switch (counter){
        case 1:
            jQuery('.mySlider').css({"background-image" : "url(/images/image1.jpg)"});
            break;
        case 2:
            jQuery('.mySlider').css({"background-image" : "url(/images/image2.jpg)"});
            break;
    }
}

if(jQuery('.mySlider').length) {
    setInterval(setBckImage, 5000);
}

過渡的CSS是這樣的：

.mySlider{
left: 0px;
-webkit-transition: background 1000ms ease-in 1000ms;
-moz-transition: background 1000ms ease-in 1000ms;
-o-transition: background 1000ms ease-in 1000ms;
transition: background 1000ms ease-in 1000ms;
}

它可以完美地在chrome中工作，但不能在Firefox中工作。 我已經讀過firefox需要一個“移動”過渡的起點，這不是我正在做的事情，但是無論如何我還是要設置一個，並且仍然不起作用。 我的firefox控制台沒有錯誤，所以我不知道可能是什么問題...

我應該從哪里開始尋找？

編輯：這是jsfiddle： https ：//jsfiddle.net/kkyyzzug/

Answer 1

基於此答案 -Firefox尚未實現過渡背景圖像。 您可以更改圖像容器的類名，而不是更改行內背景。 因此，根據類名稱，您可以更改背景圖像