重新加载砌体内容

Question

我正在尝试在更改元素高度时更新砌体页面的布局。如果您调整 window 的大小，我希望这些元素能够像它们一样自动重新适合。我尝试了很多方法，现在似乎什么也没做：

function masonryReload() {
                jQuery('#container').masonry('reloadItems');
            }

我是不是遗漏了什么，或者是否有其他方法更适合我的要求？

如果有人对此有任何经验，将不胜感激。

更新： JS 函数：

function masonryReload() {
            jQuery('#container').masonry('reload');
        }

HTML:

 <li id="logo" style="padding-right: 25px;" onclick="masonryReload();"><img src="<?php bloginfo('template_directory'); ?>/img/logo.png"></li>

Answer 1

.masonry('reload')

它已在文档中定义，但只需再次使用 .masonry() 即可。

遵循您的代码。远离内联 onclick 处理程序，并将其全部放在 JS 中：

HTML

<li id="logo" style="padding-right: 25px"><img src="<?php bloginfo('template_directory'); ?>/img/logo.png"></li>

JS

function masonryInit() {
    jQuery("#container").masonry();
    console.log("It works!");
}

jQuery(document).ready(function() {
    masonryInit();
    $("#logo").click(masonryInit());
});

重新加载砌体内容

Reloading masonry content

jquery

masonry