等待jQuery瀑布/ masonry完成元素加载后再显示包含的div

Question

我知道如何在页面加载完成后才显示div。

但是用这种方法不能让jQuery瀑布正常工作。

因此，目前jQuery瀑布订购了一些博客帖子，这些帖子以单独的div显示，每个帖子都有一个图像作为“缩略图”。有16个这样的div显示在容器内，每个div占据了砖石网格中1/16的空间。

然而，目前，当页面加载时，div被加载为全宽，然后看起来就像瀑布工程使它们适合网格。在我看来，这是不专业的。

所以这个想法是，当瀑布函数发挥它的魔力时，只需显示一个加载图标，然后一旦完成，div就会显示出来。

我已经将div设置为

display: none

这就是jQuery瀑布所使用的：

$(window).load(function(){  
  $('#buildcontainer').waterfall({ 
    colMinWidth: 250, 
    defaultContainerWidth: 1000,
    autoresize: true
  });
  $("#buildcontainer").show();
});

在某种意义上，这可以很好地工作，并且div只有在页面加载完成后才会显示。

然而，实际的瀑布网格函数现在不起作用了。如果我没有使用瀑布，那么div的加载方式就会很简单。

有谁有什么想法吗？

Answer 1

排序后，只需在使用瀑布之前对包含的div进行fadeIn / show！

Answer 2

瀑布的示例建议使用document.ready：

$(document).ready(function(){  
  $('#buildcontainer').waterfall({ 
    colMinWidth: 250, 
    defaultContainerWidth: 1000,
    autoresize: true
  });
});