0

大家！

我正在从头开始构建我的第一个网站。我知道 HTML 和 CSS，但我对 JavaScript 和 PHP 的了解非常基础。因此，对于我使用 Masonry 网格布局库的网站，将其与 ImagesLoaded 相结合，这样图像就不会重叠。根据官方网页上的说明，我在我的 HTML 中包含了一个脚本，但不知何故它根本不起作用。（只是 Masonry，没有 ImagesLoaded，正在工作，但图像重叠。）请告诉我，我做错了什么。

这是网页。如您所见，Masonry 没有初始化。

http://vprilenska.netai.net/design_archandfilm.php

这是脚本。我已将它包含在我的 HTML 底部的正文结束标记之前。

<script src='js/masonry.js'></script>
<script src='js/imagesloaded.js'></script>
<script>
    var container = document.querySelector('#masonry');
    var msnry;
    // initialize Masonry after all images have loaded
    imagesLoaded( container, function() {
        msnry = new Masonry( container, {
        gutter: container.querySelector('.gut_width'),
        itemSelector: '.item',
        stamp: '.stamp',
        columnWidth: container.querySelector('.col_width');
        });
    });
    </script>

是的，砌体应用于物品。每个项目都是一个带有图像和标题的 div，向右浮动。所有图像都位于容器砌体中。列宽和装订线由元素定义。

4

1 回答 1

0

脚本无法正常工作，因为出现了意外的“；” 在以下行中：

columnWidth: container.querySelector('.col_width')
于 2014-08-15T12:43:29.780 回答