覆盖图像与砌体在WP

overlay images with Masonry in WP

本文关键字:WP 覆盖图 图像 覆盖      更新时间:2023-09-26

我正在使用砌体和WordPress制作一个小项目来评估图像…

我遇到的问题是,Mansonry的图像与其他图像重叠。

http://postimg.org/image/kmvnzi7sh/

这是解决方案,但我不知道如何修复它。——> http://masonry.desandro.com/imagesloaded

在header中我有这个:

    <script src="http://code.jquery.com/jquery-2.1.1.min.js"> </script>

在页脚我有这个:

        <script type="text/javascript">
var container = document.querySelector('.span12');
var msnry = new Masonry( container, {
  // options
  itemSelector: '.item-grid'
});
</script>

我不知道该怎么处理这个:masonry.desandro.com/appendix.html # imagesloaded

顺便说一句:我知道有几个插件可以让我想要的效果相同,但我不喜欢使用插件…

我希望有人能帮我解决这个问题!

谢谢!

你只需要包含imagesLoaded脚本并在imagesLoaded回调中初始化砌体,如下所示:

var container = document.querySelector('.span12'),
    msnry;
imagesLoaded( container, function() {
    msnry = new Masonry( container, {
      // options
      itemSelector: '.item-grid'
    });
});