jquery - 带有大尺寸图像的 Chrome 中的延迟不透明度变化

Question

我有一个简单的幻灯片放映，我在显示新照片之前淡出当前照片。它在 FF 和 IE 下效果很好，但在 Chrome 中效果非常滞后......

我发现 Chrome 中的延迟只出现在大尺寸图像上

这是重现的代码：

    this.oldimg  = this.img;
    this.img = new Image(); 
    $(this.img).css({width: '90%', height: '90%'});
    $(this.img).attr("src", "//file.jpg");
    $("body").prepend(this.img);
    if(this.oldimg) $(this.oldimg).fadeTo(600, 0, function() { $(this).remove();  });

在这里工作演示：http: //jsfiddle.net/f3tta/18/embedded/result/

（注意：评论参考了之前的演示，避免浏览器缓存在这里）

你能重现吗？我必须有什么解决方案来避免滞后而不必提供完美缩放的图像？

Answer 1

好的，所以如果有人遇到同样的问题，我找到了绕过问题的解决方案：

if(this.oldimg) $(this.oldimg).delay(50).fadeTo(600, 0, function() { $(this).remove();

我不知道为什么，当我们稍微延迟淡出时，chrome几乎可以正常播放效果。