javascript - 延迟加载背景图像/淡入淡出替换背景图像

Question

我正在构建一个使用 Maximage jquery 插件来运行背景图像幻灯片的站点。由于图像的大小，我决定尝试实施延迟加载方法，该方法将用已在后台下载的高质量图像替换低质量图像。

该代码有效，但问题是有一个明显的闪光，因为background-image srcmaximage 幻灯片的 更改为指向更高质量的图像。

我不确定如何解决这个问题，有没有办法淡入替换 div 的背景图像？

谢谢你的帮助。

Answer 1

Could you write it in such a way that once the high quality image is done loading, instead of replacing the low quality image, insert the high quality into DOM as a hidden DIV or something like that.

然后淡出低质量的包装器 DIV，因为您淡入高质量的包装器 DIV（即同步动画）作为动画完成的回调，分离/隐藏低质量的 DIV。不过，这可能仍会导致某些浏览器/设备闪烁，我必须设置一个演示或其他东西才能看到。