砌體中被戳的物品被完全忽略

求助：問題是砌石護欄的寶石;它使用了一個沒有郵票選項的老式石工叉。將砌體CDN添加到項目中可以解決問題。砌體中被戳的物品被完全忽略

我一直在試圖在Rails項目中的磚石工程中獲得'郵票'功能。我想要的是砌體物品能夠貼合在我印記的物體周圍的空白空間，並且我的印記物體被鎖定在父元素的右上角。但是，加蓋的元素看起來完全不在任何砌體中，而是砌在砌磚中的所有東西上，就好像印花不存在於佈局中一樣。我無法按照我打算的方式工作。

當我在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; 
}

而在CoffeeScript的文件：

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

來源

2017-02-28 joespam

這個問題是因爲我使用了masonry-rails gem，它的砌體分支是3.x，並且其印記功能和界面與當前文檔不同。沒有錯誤或警告，「郵票」選項從字面上看沒有任何作用。一旦我刪除了gem並添加了當前的砌體CDN，上面的代碼就開始顯示預期的行爲。

這個問題被jsfiddle和codepen混淆了，因爲大量代碼示例的混合內容導致失敗（直到控制檯被打開）。

來源

2017-04-26 02:06:27 joespam

砌體中被戳的物品被完全忽略

回答

相關問題