等待图像加载插件无法正常工作

时间:2016-08-26 06:38:45

标签: javascript jquery html css waitforimages

我使用https://github.com/alexanderdickson/waitForImages中的插件来检测图片何时加载。

以下是我的代码:

$('.marquee').waitForImages(function() {
  console.log('All images have loaded.');
  setTimeout(startMarquee);
}, function(loaded, count, success) {
  console.log(loaded + ' of ' + count + 
   ' images has ' + (success ? 'loaded' : 'failed to load') + '.');
  $(this).addClass('loaded');
});

当图像加载完成后,我将开始滚动图像。

我的问题是,有些图片还没有加载,只是显示一个像我这样的小方框:  enter image description here

插件也认为它已经加载了。知道怎么解决吗?

仅显示一个小的空方框是否考虑加载图像?

2 个答案:

答案 0 :(得分:0)

写下你自己的。

groupmap.keySet()

如果您想给图像一个机会而不加载选框,如果发生永久性错误,您可以尝试

<marquee id="marquee" style="visiblity:hidden">
  <img src="image1.jpg" onload="countMe(this,1)" onerror="countMe(this,0)"/>
  <img src="image1.jpg" onload="countMe(this,1)" onerror="countMe(this,0)"/>
  <img src="image1.jpg" onload="countMe(this,1)" onerror="countMe(this,0)"/>
 </marquee>

 <script>
 var imageCount = 0, nofImages=$("#marquee img"); 
 function countMe(img,success) {
   if (!success) $(img).hide();
   imageCount++;
   if (imageCount == nofImages) $("#marquee").show();
 }
 </script>

答案 1 :(得分:0)

如果您想在运行选取框代码之前等到所有页面图像都加载,您可以使用:

$(window).on("load", function() {
    // all page html and images loaded
});

可以在以下问题中找到更多详细信息: Official way to ask jQuery wait for all images to load before executing something