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

您不应该能够转换背景图像。我很惊讶 chrome 实际上在图像之间交叉淡入淡出。

我建议为每个图像定义两个容器并将它们放在彼此之上。 “事件”图像会将其不透明度设置为 0，并在悬停时转换为 1。