Question

已解决：问题是砌体轨道宝石;它使用了一个没有印章选项的旧石工叉。将砌体CDN添加到项目中已解决了该问题。

我一直在尝试在Rails项目中使用砌体中的'印章'功能。我想要的是砌体物品适合我的“邮票”对象周围的空白空间，以及我的标记物体被锁定到父元素的右上角。然而，标记元素似乎完全被排除在任何砌体定位之外，而是砌筑瓷砖中的所有内容，就像布局中不存在标记一样。我无法按照我想要的方式运行这些功能。

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

这是页面的当前状态： 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;
}

在coffeescript文件中：

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

Answer 1

问题是因为我使用的是masonry-rails gem，其砌筑的叉子是3.x，其印章功能和界面与当前文档不同。没有任何错误或警告，“邮票”和“邮票”。字面上的选项只是没有效果。一旦我删除了gem并添加了当前的砌体CDN，上面的代码就开始显示预期的行为。

由于许多代码示例的混合内容，jsfiddle和codepen无声地失败（直到控制台被打开）这个问题更加复杂。

砌体中的戳记项目被完全忽略

1 个答案: