动态添加div，但图片加载速度很慢

我基于ajax回调动态创建div。每个div包含一个png图片：动态添加div，但图片加载速度很慢

var myDiv = "<div class='myClass' id='divid'>" + 
      "<img id='newDiagDivId' src='images/approved-icon.png'>" + 
      "<div style='display:inline-block;vertical-align:top;'>blah</div>" + 
      "</div>";

...这里是我如何添加：

$(myDiv).hide().appendTo(divContainer).fadeIn(100);

DIV的显示格式正确，但PNG图像大约需要5-10s露面。这是一个很小的图像，只有2kb，由应用程序本身托管。这个问题发生在FF，Chrome和IE上，在行为上几乎没有区别。

页每秒处理约2-3 AJAX回调在“速射”时尚，吐出这些div每个回调，我没有一个缓慢的机器，所以我不怀疑的浏览器，而下跌的背后加载图像。

有什么我可以做的，以强制图像加载更快，或立即在div被添加到DOM？

来源

2013-08-22 raffian

你在其他浏览器中检查过它吗？ – srijan

这是FF，Chrome和IE中的同样交易。 – raffian

可能是[Javascript：图像加载太慢]的副本（http://stackoverflow.com/questions/6524935/javascript-images-loading-too-slowly） – Itay

好了，我回答我的问题再次...

决定基于this的DOM预载图片，在FF，Chrome浏览器，IE浏览器！

$(window).load(
     function() { 
      preload(['images/approved-icon.png','images/denied-icon.png'])}); 

function preload(arrayOfImages) { 
    $(arrayOfImages).each(function() { 
     $('<img />').attr('src',this).appendTo('body').css('display','none'); 
    }); 
}

来源

2013-08-22 16:52:31 raffian

回答

相关问题