javascript - 首次加载时堆叠的 masonry 图像

Question

我正在使用 Masonry 来显示图像网格； http://aandagtvooru.nl/grid

但在第一次加载时，所有图像都堆叠在一起，而不是显示为砖石网格。

使用的JS:

var container = document.querySelector('#grid');
var msnry = new Masonry( container, {

  itemSelector: '.grid-item'
});

$(window).load(function(){
    var $container = $('#grid').masonry();
        $container.imagesLoaded( function() {
        $container.masonry({itemSelector: '.grid-item'});
    });
});

Answer 1

首先，我没有看到您在页面中包含 jquery.js，masonry 是如何工作的？

第二，在您的页面上仅保留此内容

$(window).load(function(){
    var $container = $('#grid');
    $container.imagesLoaded( function() {
        $container.masonry({itemSelector: '.grid-item'});
    });
});

所有其他 masonry 调用都是不必要的。