Chrome 中大图像的淡入淡出

我在大图像中淡入淡出时遇到一些问题，但仅限于 Chrome。

这是绝对基本的设置：

$(document).ready(function(){
   var img = new Image();
   $(img)
      .hide()
      .load(function(){
         $(this).fadeIn(3000)
      })
      .attr("src", "files/originals/01.jpg")
   $("body").append(img)
});
  

据我所知，这是动态创建图像、加载图像并在加载完成后淡入的传统方法。 现在，这在 FireFox、Safari 甚至 IE 中都可以完美运行，但当我使用大图像（分辨率大于 1900x1200）时，在 Chrome 中就不行了。在有人对尺寸大发雷霆之前，我应该补充一点，这是该项目的要求。 除 Chrome 之外的所有浏览器中都会发生的情况是，图像加载时会出现延迟（预期），并且一旦完成就会淡入。 在 Chrome 中，我在加载图像时得到常规延迟，然后在 fadeIn 持续时间（在我的示例中为 3000 毫秒）内得到另一个延迟，之后图像只是“出现”，就像我使用 show() 一样。 不过，较小的图像在所有浏览器中都能完美运行。

是什么赋予了？我缺少什么？

也许尝试在图像加载后将其插入移动到 DOM 中？像这样：

$(document).ready(function(){
   var img = new Image();
   $(img)
      .hide()
      .load(function(){
         $("body").append(this);
         $(this).fadeIn(3000);
      })
      .attr("src", "files/originals/01.jpg")
});