jQuery Masonry排序顺序从左到右,而不是从上到下？

在目录网站上使用砖石.默认情况下,显示的项目按日期排序,然后按部件号排序.我的图像变化很大.问题是,如果我错了,请纠正我,Masonry将第2行,第1项设置在第1行中最短的项目下方,而不是页面左侧.所以换句话说,当我的数据库返回一个特定的顺序时,Masonry将那些从上到下的顺序排列(当变化的高度)时,而不是从左到右.

文档中没有找到任何东西来控制它.有没有办法强制砌体将物品从左到右依次按垂直方向垂直放置？

我试图张贴插图,但显然我没有资格这样做.这里有一个图示的链接：

解决方法

在Masonry中没有选择排序项目,因为它是一个简单的插件,将砖块逐个放置.选择新的砖头位置很简单：尽可能地放置更高的位置.

但是,在这种情况下可以做的是通过添加一个定义排序的两行来改变脚本,假设所有砖块的宽度相同(例如,总共为5行).

为了演示这个,我使用jQuery Masonry(被压缩),你可以在this Fiddle中查看.

JS

$.Mason.prototype._placeBrick = function(e) {
    var n = $(e),r,i,s,o,u;
    r = Math.ceil(n.outerWidth(!0) / this.columnWidth),r = Math.min(r,this.cols);
    if (r === 1) s = this.colYs;
    else {
        i = this.cols + 1 - r,s = [];
        for (u = 0; u < i; u++) o = this.colYs.slice(u,u + r),s[u] = Math.max.apply(Math,o)
    }
    var a = Math.min.apply(Math,s),f = 0;
    for (var l = 0,c = s.length; l < c; L++)
        if (s[l] === a) {
            f = l;
            break
        }
    /* Add new calculation,what column next brick is in: */
    f = $(e).index() % this.cols; /* Get col index f: Just divide with element's index */
    a = s[f]; /* This is current height for f-th column */
    /* END of customizing */
    var h = {
        top: a + this.offset.y
    };
    h[this.horizontalDirection] = this.columnWidth * f + this.offset.x,this.styleQueue.push({
        $el: n,style: h
    });
    var p = a + n.outerHeight(!0),d = this.cols + 1 - c;
    for (l = 0; l < d; L++) this.colYs[f + l] = p;
};

原文地址：https://www.jb51.cc/jquery/176064.html