砌体中的标记项目被完全忽略答案

【问题标题】：Stamp’ed item in Masonry being completely ignored砌体中的标记项目被完全忽略
【发布时间】：2017-02-28 20:26:54
【问题描述】：

已解决：问题是 masonry-rails gem；它使用了没有邮票选项的旧砖石叉。将 masonry CDN 添加到项目中已解决问题。

我一直在尝试在 Rails 项目中使用砌体中的“标记”功能。我想要的是让砖石项目自己适应我的“加盖”对象周围的空白空间，并将我的加盖对象锁定在父元素的右上角。但是，stamped 元素似乎完全被排除在任何 Masonry 定位之外，而是 masonry 平铺 div 中的所有内容，就好像该图章不存在于布局中一样。我根本无法让功能按照我想要的方式工作。

当我按下 desandro 的 codepen 示例中的按钮时没有任何反应：https://codepen.io/desandro/pen/wKpjs，所以我真的不知道我是否有某种浏览器/操作系统/库问题，或者我只是标记错误。

这是页面的当前状态： images tiled underneath stamped element, instead of tiled around it

HAML 中的布局：

#signupGal.centered
  - if @displayPix.present?
    - @displayPix.each_with_index do |pic,i|
        = link_to pic do 
            .picTile{:id => "tile#{i}"}
                :javascript
                    $('#tile#{i}').css({
                        "background-image":'url(' + "#{pic.image.url(:medium)}" + ')',
                        "background-position":"center",
                        "background-size":"cover"
                    });

  .signupForm.bg.tc

CSS：

.bg {
    background-color: rgb(63,168,161);
}

.tc {
    color: white;
}

.signupForm {
    width: 752px;
    height: 558px;
    position: absolute;
    right: 1%;
    top: 10px;
    width: 80%;
    border-radius: 5px;
    border: 3px solid white;
    padding: 1em;
}

#signupGal {
    max-width: 1200px;
    position: relative;
    .picTile {
      width: 160px;
      height: 120px;
      float: left;
      margin-bottom: 3px;
      margin-right: 3px;
    }
}

/* clearfix */
#signupGal:after {
  content: '';
  display: block;
  clear: both;
}

在咖啡脚本文件中：

$ ->
    $('#signupGal').imagesLoaded ->
        $gallery = $('#signupGal')
        $gallery.masonry
            isAnimated: true
            isFitWidth: true
            itemSelector: '.picTile'
            stamp: '.signupForm'

【问题讨论】：

标签： ruby-on-rails masonry

【解决方案1】：

问题是因为我使用的是 masonry-rails gem，它的 masonry 分支是 3.x，并且其标记功能和界面与当前文档不同。没有错误或警告，'stamp' 选项实际上没有任何效果。一旦我删除了 gem 并添加了当前的 masonry CDN，上面的代码开始显示预期的行为。

由于大量代码示例的混合内容，jsfiddle 和 codepen 静默失败（直到打开控制台）加剧了这个问题。

【讨论】：