无法重新加载jQuery Masonry

Question

我有一个网站，上面有25张图片。我创建了一个按钮，上面写着“加载更多”。这些按钮通过Ajax从php脚本中提取25张图片。这部分实际上工作得很好。问题是，我使用jquery masonry来对齐图像。

现在，它在页面加载时调用Masonry函数。

function Masonry() {
    var $container = $('#fit');
    $container.imagesLoaded(function () {
        $container.masonry({
            itemSelector: '.masonryImage'
        });
    });
}

但是，当我想随后调用Masonry()函数时，它不起作用。

如果我不在加载时调用Masonry()，那么它在我的ajax函数中工作得很好。

你知道为什么会发生这种情况吗？

Answer 1

在重新加载后再次调用bulk masonry()修复了这个问题。

$('#fit').append(newitems).masonry('reloadItems').masonry();

Answer 2

您需要调用appended将新项添加到砖石容器中：

$('#fit').masonry( 'appended', newitems);

仅供参考:作为使用“加载更多”按钮的替代方案，看看使用无限滚动：http://masonry.desandro.com/demos/infinite-scroll.html