Question

我有一个显示25张图片的网站。我创建了一个“加载更多”的按钮。按钮通过Ajax从php脚本中提取25个图像。这部分实际上工作正常。问题是，我正在使用jquery砌体来对齐图像。

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

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

但是，当我想在之后调用Masonry（）函数时，它不起作用。

如果我没有在加载时调用Masonry（），它在我的ajax函数中工作正常。

关于为什么会发生这种情况的任何想法？

Answer 1

重新加载后再次调用批量砌体（）为我解决了这个问题。

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

Answer 2

您需要致电appended将新商品添加到砌体容器中：

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

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

无法重新加载jQuery Masonry

2 个答案: