toggleClass上的jQuery和CSS過渡更改背景圖像

Question

我有一個背景圖像的div。
我使用此代碼添加的類將另一個圖像設置爲背景。

$(".imageclass").hover(function() { 
    $(this).toggleClass("imageclass2"); 
}); 

我儘量平穩過渡類時觸發，但這樣的：

-webkit-transition: 0.4s ease; 
-moz-transition: 0.4s ease; 
-o-transition: 0.4s ease; 
transition: 0.4s ease; 

只在Chrome

作品，你可以在這裏看到

https://jsfiddle.net/ng8d2cqt/1/

Answer 1

你不應該能夠轉換背景圖像。我很驚訝鉻實際上是在圖像之間交叉淡化。

我會建議爲每個圖像定義兩個容器，並將它們放在彼此的頂部。 「活動」圖像將其不透明度設置爲0，懸停時轉換爲1。