如何使用正确的高度附加图像，不使用砌体和imagesloaded插件重叠？

Question

目前在我的网站上，一旦所有图片都加载了所有项目，我就会使用imagesloaded来进行砌体处理。但这会导致一系列项目（项目div一个排列在另一个之下），直到所有图像都被加载然后再发生砌体。

$(document).ready(function(){do_masonry();});

function do_masonry(){
var $container = $('#content');
var gutter = 10;
var min_width = 200;
$container.imagesLoaded( function(){
   $container.masonry({
        itemSelector : '.item',
        gutterWidth: gutter,
        isAnimated: true,
        columnWidth: function( containerWidth ) {
           //some calculations to set each item div's width
            return item_width;
          }
    });

我想在文件就绪时立即进行砌体处理，然后将图像附加到形成项目的每个div中，但是当我尝试这个时，结果看起来很丑，div在砌体布局中垂直重叠。

我想知道如何使用正确的高度将图像延迟加载到每个div而不使用砌体附加重叠？