jQuery梅森角落郵票

Question

jQuery砌體是偉大的，但是，有沒有人能夠獲得角落郵票出現在頁面的左上角？我嘗試更改爲float: left;，但這似乎不起作用。

此外，當我調整窗口的大小時，調整大小不會自動調整角標。

這裏的CSS

.corner-stamp { 
width: 270px; 
height: 300px; 
padding: 10px; 
float: right; 
background: red; 
color: white; 
-moz-border-radius: 15px 0px 15px 0px; 
-webkit-border-radius: 15px 0px 15px 0px; 
border-radius: 15px 0px 15px 0px; 
} 

和這裏的JS：

$.Mason.prototype.resize = function() { 
    this._getColumns(); 
    this._reLayout(); 
}; 
$.Mason.prototype._reLayout = function(callback) { 
    var $cornerStamp, cornerStampX, freeCols, i; 
    freeCols = this.cols; 
    if (this.options.cornerStampSelector) { 
    $cornerStamp = this.element.find(this.options.cornerStampSelector); 
    cornerStampX = $cornerStamp.offset().left - (this.element.offset().left + this.offset.x + parseInt($cornerStamp.css("marginLeft"))); 
    freeCols = Math.floor(cornerStampX/this.columnWidth); 
    } 
    i = this.cols; 
    this.colYs = []; 
    while (i--) { 
    this.colYs.push(this.offset.y); 
    } 
    i = freeCols; 
    while (i < this.cols) { 
    this.colYs[i] = this.offset.y + $cornerStamp.outerHeight(true); 
    i++; 
    } 
    this.layout(this.$bricks, callback); 
}; 
$container = $("#streams"); 
$container.imagesLoaded(function() { 
    $container.masonry({ 
    itemSelector: ".stream-item", 
    columnWidth: 60, 
    isAnimated: false, 
    isFitWidth: true, 
    cornerStampSelector: '.corner-stamp' 
    }); 
}); 

Answer 1

你或許可以找到你所需要right here on github

Answer 2

對於float留下的代碼，你最好的選擇是保證「加蓋印花的」瓷磚是您列表中的第一個瓷磚。

此外，我一直在玩角落衝壓，並注意到設置isFitWidth: true干擾角落衝壓。

如果您發現了一個更好的左轉角印花方式，請告訴我。如果你找到了一個右轉角的方法，但在頁面中心的瓷磚，請讓我知道。

謝謝。