プラグインが機能しないのを待つ画像

Question

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'); 
}); 

イメージが完全にロードされたとき、私は画像のマーキースクロールを開始します。

私の問題は、いくつかのイメージがまだロードが、ちょうどこのような小さな空の正方形のボックスを表示していなかった、次のとおりです。 、

のプラグインも、それはすでにロードを検討してください。どのようにそれを修正するための任意のアイデア？

小さな空の四角いボックスのみを表示するのは、画像が読み込まれたと考えられますか？

Answer 1

あなた自身で作成してください。

<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> 

あなたは画像にチャンスを与えると、あなたのマーキーコードあなたを実行する前にロードされたすべてのページ画像まで待つしたい場合は永久的なエラーがあなたが

<marquee id="marquee" style="visiblity:hidden"> 
    <img src="image1.jpg" onload="countMe(this)" onerror="reloadMe(this)"/> 
    <img src="image2.jpg" onload="countMe(this)" onerror="reloadMe(this)"/> 
    <img src="image3.jpg" onload="countMe(this)" onerror="reloadMe(this)"/> 
</marquee> 

<script> 
var imageCount = 0, nofImages=$("#marquee img"); 
function countMe(img) { 
    imageCount++; 
    if (imageCount == nofImages) $("#marquee").show(); 
} 
function reloadMe(img) { 
    var tries = img.getAttribute("tries")?parseInt(img.getAttribute("tries"),10):1; 
    if (tries) == 3) return; // stop it 
    tries++; 
    img.setAttribute("tries",tries); 
    img.src=img.src; 
} 
</script> 

Answer 2

を試すことができるかどうかではないマーキーをロードする場合使用することができます。

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

詳細はこの質問で見つけることができます： Official way to ask jQuery wait for all images to load before executing something