在jQuery生成的div上使用Masonry.js

Question

那天我发现了Masonry.js，并且想在项目中开始使用它。为了练习，我决定尝试制作一个页面，每次点击一个随机高度和颜色的按钮时会生成16个div，并观察它们的位置。事情是，它不工作。 div生成的很好，看起来问题在于让Masonry重新计算生成的div的容器高度。没有容器的高度，砌体不能计算任何其他div的适当高度。我已经尝试在容器上使用clearfix来确保它围绕嵌套元素延伸，但没有运气。谁能帮忙？

Check out this Pen of it

Answer 1

您需要使用为addItems添加项或者销毁，并重新将它重新计算： http://codepen.io/bhlaird/pen/HusbL

//Reload Masonry 
$wall.masonry('destroy'); 
$wall.masonry({ 
    columnWidth: '.brick', 
    itemSelector: '.brick' 
}); 

您也可以重新加载和布局：

//Reload Masonry 
$wall.masonry('reloadItems'); 
$wall.masonry('layout');