Masonry 插件：调整 div 大小不会导致重新洗牌

将 Masonry 项目包裹在 1000px 宽的 div 中，我有一个按钮可以使用 jQuery 将 div 大小调整为 2000xaddClass()，问题是 Masonry 不会重新排列项目来填充额外的 1000px 空间，我知道调整大小是有效的，因为调整浏览器窗口大小会导致重新排列。

Masonry:

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

Button:

$("a.button").toggle(function(){
    $(this).addClass("flip");
    $("div#container").fadeOut("fast", function() {
        $(this).fadeIn("fast").addClass("resize");
    });

CSS:

width: 1000px; /* default */
width: 2000px !important; /* on button press */

我尝试运行 ('a').使用相同的按钮单击 Masonry 函数，它似乎工作正常，但问题仍然存在。

有什么建议吗？我很困惑：/

我相信当您单击尺寸按钮时，您需要再次运行砌体功能。

$("a.button").toggle(function(){
    $(this).addClass("flip");
    $("div#container").fadeOut("fast", function() {
    $(this).fadeIn("fast").addClass("resize");
    // run masonry again
    $('#container').masonry({      
      itemSelector : '.item',
      columnWidth : 240
    });
});