Question

我经常玩这个，并且在一堆项目中使用了Masonry。我很难过。

我将包含元素CSS设置为：

#content.video-grid {
    margin: 0 auto;
    overflow: hidden;
}

给每个砖块提供这个CSS：

.grid-block {
    float: left;
    height: 220px;
    width: 240px;
    overflow: hidden;
    padding: 0 0 20px 0;
}

而Masonry这样叫：

    jQuery('#content.video-grid').masonry({
        itemSelector : '.grid-block',
        columnWidth : 240,
        isAnimated: true,
        isFitWidth: true,
        gutterWidth: 2
    });

这会导致在加载页面后没有“洗牌”砖块，但由于某种原因它会等到所有内容都被加载，然后它会根据isFitWidth的规定将宽度应用于包含元素。

这里不起作用： http://dev.massmarket.tv/work/all/

以下是相同的实现工作： http://www.caviarcontent.com/los-angeles/

所以必定会有一些东西导致砌体迟到，但我一直无法弄明白。为了清楚起见，我希望在加载图像之前运行Masonry，以便在加载图像之前将砖块放在正确的位置。

谢谢！

Answer 1

您是否尝试将代码包装在：

$(window).load(function(){

});

Answer 2

$('img').load(function(){
    $('#container').masonry();
});

不确定它是否适用于您的情况..

砌体在页面渲染中运行较晚

2 个答案: