CSS3禁用后台大小转换

Question

我正在使用jQuery多次更改背景图像并添加了过渡效果：

.background-container  {
   -webkit-transition: background-image 3s linear;
   -moz-transition: background-image .3s linear;
   transition: background-image .3s linear;
   background-size: cover;
}

转换有效但它也适用于背景大小（我认为......），使转换时间超过.3s。例如，如果一个图像的高度或宽度大于另一个图像，则图像缩小时转换需要更长的时间。

非常奇怪......它不是由我的jQuery（我测试过）造成的，并且在使用相同高度和宽度的图像时效果很好。

如何解决这个问题？

整个代码：

HTML：

<div class="background-container">
  <div class="box" data-img="some url to image"></div>
  <div class="box" data-img="some url to image"></div>
  <div class="box" data-img="some url to image"></div>
</div>

jQuery的：

$('.box').hover(function() {
    var imgUrl = $(this).attr("data-img");
    if (imgUrl !== "") {
        $('.background-container').css("background-image", "url(" + imgUrl + ")" );
    }
});

当悬停.box时，容器的背景图像会发生变化。如果一个背景图像较大，则转换所需的时间超过0.3秒。这不应该发生，因为我没有背景大小的转换。