針對 jQuery Gridly 控件顯示多少列的問題。

針對 jQuery Gridly 控件顯示多少列的問題，完全根據 columns 的值來顯示。

但是顯示columns，並不是給多少值顯示幾列。到目前還是很模糊的。官方文檔沒有給出具體的一個解釋。

 

 

 

 

$('.gridly').gridly({
base: 60, // px
gutter: 20, // px
columns: $("#FormColumnCount").val() * 3,
callbacks: {
reordered: function ($elements) {

// Called after the drag and drop ends with the elements in their ending position.
// 當前對象
var currentObj = this.reordered.arguments[1];

var arr = $elements;
// 前一個對象
var prevObj;
// 后一個對象
var afterObj;
for (i = 0; i < arr.length; i++) {
$(arr[i]).find('input[name=SortBy]').val((i + 2) * 10);
}

//執行保存排序，更新數據
//sortData...
}
}
});

　　

 

 

決定坐標的代碼如下：

   Gridly.prototype.position = function($element, columns) {
      var column, height, i, j, k, max, ref, ref1, ref2, size;
      size = this.size($element);
      height = Infinity;
      column = 0;
      for (i = j = 0, ref = columns.length - size; 0 <= ref ? j < ref : j > ref; i = 0 <= ref ? ++j : --j) {
        max = Math.max.apply(Math, columns.slice(i, i + size));
        if (max < height) {
          height = max;
          column = i;
        }
      }
      for (i = k = ref1 = column, ref2 = column + size; ref1 <= ref2 ? k < ref2 : k > ref2; i = ref1 <= ref2 ? ++k : --k) {
        columns[i] = height + ($element.data('height') || $element.outerHeight()) + this.settings.gutter;
      }
      return {
        x: column * (this.settings.base + this.settings.gutter),
        y: height
      };
    };