jquery - 如何确定只有可见图像下载完成并在页面中呈现

Question

这是我可以实现图像延迟加载功能的代码。我需要知道何时只有可见图像下载完成并在页面中呈现。这将如何成为可能。

这是我的代码

$(document).ready(function () {
$("table[id*=dgImages] img").each(function () {
if($(this).offset().top > $(window).scrollTop() && $(this).offset().top <    $(window).scrollTop() + $(window).height()) {

  // callback on load complete          
  this.onload = function() { 
    alert('this image download complete'); 
    $(this).fadeIn('slow');
  }

  $(this).attr("src", $(this).attr("original"));
  $(this).removeAttr("original");
}
});
});

借助以下代码，我可以确保每个图像下载何时在客户端完成。

this.onload = function() { 
    alert('this image download complete'); 
    $(this).fadeIn('slow');
  }

所以我需要另一个回调机制，它会触发并通知我只有可见图像下载完成并在页面中呈现。请讨论这个问题如何实现。谢谢

Answer 1

也许this one帮助你