图像没有按照需要的顺序加载

Question

我已经为我的图像分配了一个div id，目的是按特定顺序加载它们。然而，他试图加载的图像（pocket2.png）并不是。任何想法为什么？网站在这里http://edharrisondesign.com/pocketpictograms/。

在此先感谢！

 jQuery(document).ready(function($) { 

     $(".preload").each(loadImages); 

      function loadImages (i, elem) { 

       var numItems = $('.preload').length; 
       for (var i = 0; i < numItems; i++) { 

        $("#img" + i).each(function(){ 
         var thisSource = $(this).data('src'); 
         $(this).html('<img src="' + thisSource + '" alt=""/>'); 
        }); 
       } 

     } //<end loadImages function> 

    }); 

Answer 1

这些图像都是异步加载的，这意味着它们会以先完成的顺序进行加载，最有可能是最小的图像先出现。我真的不担心他们加载的顺序，这对于一个体面的连接没有什么影响。

如果你真的想优化你的图片加载，你应该有一个巨大的图像包含所有图像，并使用CSS或JavaScript分割它。这意味着只有一个请求到服务器而不是numItems请求。