Question

将砌体物品包裹在1000px宽的div中，我有一个按钮，使用jQuery的addClass()将div调整为2000x，问题是Masonry不会重新洗牌以填充额外的1000px空间，我知道调整大小因为调整浏览器窗口大小会导致重新洗牌而起作用。

砌体：

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

按钮：

$("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功能使用相同的按钮，它似乎正常工作，但问题仍然存在。

有什么建议吗？我很难过：/

Answer 1

我相信你需要在点击调整大小按钮时再次运行砌体功能。

$("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
    });
});

Answer 2

从http://masonry.desandro.com/methods.html#reloaditems开始，调用.masonry('reloadItems')会抓取（可能是新的）与itemSelector匹配的项目并重新定位砖块，但调用.masonry()只会根据最多重新定位项目最近的项目维度。

Answer 3

尝试使用jquery：

触发resize事件

$(window).trigger('resize');

它对我有用！

砌体插件：调整div不会导致重新洗牌

3 个答案: