Javascript 为什么我的砖石结构在'；正在加载图像吗？

我用的是desandro的砖石布局，效果很好。不过，当它加载图像时，布局就不存在了。加载所有图像后，它会重新排列自身，但加载时所有图像都会堆叠在一起

Flickr似乎是我的目标布局。在flickr photostream上，瓷砖已经以灰色背景布局，它直接将图像加载到那里。我怎样才能做到这一点

以下是我正在使用的脚本：

 var $container = $('#wall');

 $container.imagesLoaded(function(){
 $container.masonry({
 "columnWidth": ".grid-sizer",
 "gutter": ".gutter-sizer",
 "itemSelector" : '.item'
 });
});

还需要注意的是，我在WordPress主题上使用了Paul的无限加载，我正在为我的博客实现这个主题

$container.infinitescroll({
navSelector : '.pagination ', // selector for the paged navigation
nextSelector : '.next.page-numbers', // selector for the NEXT link (to page 2)
itemSelector : '.item', // selector for all items you'll retrieve
loading: {
msg: null,
msgText: "<small>loading content...",
finishedMsg: "<small>End of line.</small>",
speed: 'fast',
img: 'http://i.imgur.com/Ky3zbSs.gif'
}
},
// trigger Masonry as a callback
function( newElements ) {
// hide new items while they are loading
var $newElems = $( newElements ).css({ opacity: 0 });
// ensure that images load before adding to masonry layout
$newElems.imagesLoaded(function(){
// show elems now they're ready
$newElems.animate({ opacity: 1 });
$container.masonry( 'appended', $newElems, true );
});
}
); 

$container.infinitescroll({
导航选择器：'.pagination'，//分页导航的选择器
下一个选择器：'.next.page number'，//下一个链接（到第2页）的选择器
itemSelector:'.item'，//将检索的所有项目的选择器
装载：{
msg:null，
msgText：“正在加载内容…”，
完成DMSG：“行结束。”，
速度：“快”，
img:'http://i.imgur.com/Ky3zbSs.gif'
}
},
//触发器作为回调
函数（新元素）{
//在加载新项目时隐藏它们
var$newElems=$（newElements）.css（{opacity:0}）；
//确保在添加到砌体布局之前加载图像
$newElems.imagesLoaded（函数（）{
//显示元素现在他们准备好了
$newElems.animate（{opacity:1}）；
$container.mashing（'added'，$newElems，true）；
});
}
); 

试试

$container.mashine（'layout'）在
$container.mashise（'added'，$newElems，true）之后。这只会在无限滚动后加载砖石布局，我对此没有问题。无限加载内容时，布局正常。我想做的是当它加载图像时。当它在第一次着陆时加载图像时，布局处于关闭状态。它仅在图像加载后自行排列。