Question

我正在使用Masonry - HTML版本

我有一个div：

<div id="container" class="js-masonry" data-masonry-options='{ "itemSelector": ".item"}'>

我内心约有10：

            <div class="item">
                <img src="<?php the_field('image'); ?>" alt="<?php the_title(); ?>">
                <p></p>
                <a style="text-decoration:underline;" class="link-port" href="<?php the_field('link'); ?>" target="_blank"><?php  the_title();?></a>
                <p></p>
            </div>

问题在于，当页面首次加载（未缓存）时，前几个项目正常显示，但是在页面的下方，它们相互堆叠。它们也与页脚重叠。如果您刷新浏览器（或旋转设备），那么一切正常，但这显然不适合新访客。

JS位于页面的底部，但我移到了顶部，它仍然做了同样的事情。

以前有人遇到过这个吗？

非常感谢。

Answer 1

啊哈！ imagesLoaded似乎是答案，详情请点http://masonry.desandro.com/appendix.html#imagesloaded

砌体布局清理问题

1 个答案: