triggers - 如何在点击时触发/重新加载Masonry插件

Question

因为我有不同的选项卡，所以砌筑不会加载隐藏的项目，因此，当我单击一个新的选项卡时，图像会彼此堆叠，我知道此问题已被问过并通过单击该选项卡来触发砌筑，但是如何处理我会这样做而不会弄乱第一个选项卡。

目前用

$(function(){
$('#container').masonry({
// options
itemSelector : '.item',
columnWidth : 260
   });
});`
$(window).load(function(){   $('#container').masonry(); });

和选项卡2相同，但ID不同-＃container2

选项卡一工作正常，但选项卡二堆叠图像，直到您调整浏览器大小以修复该问题并正常工作为止

Answer 1

像这样做:

$(function(){
    $('#container').masonry({
        // options
        itemSelector : '.item',
        columnWidth : 260
   });
});

var masonryUpdate = function() {
    setTimeout(function() {
        $('#container').masonry();
    }, 500);
}
$(document).on('click', masonryUpdate);
$(document).ajaxComplete(masonryUpdate);

再也不用担心了!或者，您可以在其他动画之后再次调用它，例如:

$('#something').slideDown(600, masonryUpdate);

即使您不这样做，也只需单击页面中的任意位置，砖石就会更新。