首次加载时堆叠的砌体图像

Question

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

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

使用过的 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，砖石工程是如何工作的？

其次，在你的页面上只留下这个

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

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

首次加载时堆叠的砌体图像

Masonry Images stacked on first load

javascript

jquery

masonry