是的，我們可以修改一下 waterfall 這個函數(shù)，把參數(shù)傳入，而這個參數(shù)為 ?新加入的“盒子”，當(dāng)hArr中有“數(shù)”時，我們應(yīng)該按照 先求 hArr 最小值的方式設(shè)置 “盒子”的位置，并修改hArr中的值。當(dāng)hArr沒有“數(shù)”，說明我們是第一次擺放盒子，那么我們向 waterfall傳入的盒子就是第1批盒子，需要先正確 擺放第1行盒子，即記錄 hArr 的值。

（把hArr設(shè)置為全局變量）

類似這樣：

//將所有 newBoxs 新盒子“放好”
function waterfall(newBoxs) {
? ?var w = newBoxs[0].outerWidth(); //盒子的寬度
? ?//計算列數(shù)
? ?var cols = Math.floor(ww/w);


? ?$.each(newBoxs, function(index) {
? ? ? ?var box = newBoxs[index];
? ? ? ?var h = box.outerHeight();

? ? ? ?if(index < cols && hArr.length < cols) { ?//hArr.length < cols 條件是為了區(qū)分后續(xù)的數(shù)據(jù)加載，表明已經(jīng)有一行排在第1行了。
? ? ? ? ? ?hArr[index] = h;

? ? ? ? ? ?//移動第1行盒子到正確的位置
? ? ? ? ? ?moveBox(box, index * w, 0);
? ? ? ?} else {
? ? ? ? ? ?var minH = Math.min.apply(null, hArr);
? ? ? ? ? ?var minHIndex = $.inArray(minH, hArr);

? ? ? ? ? ?hArr[minHIndex] += box.outerHeight();
? ? ? ? ? ?moveBox(box, minHIndex * w, minH);
? ? ? ?}
? ?});
}

那么加載數(shù)據(jù)時就可以：

$(window).on("scroll", function() {

? ?var boxArr = [];
? ?if(checkScrollSlide()) {

? ? ? ?$.each(dataInt.data, function(key, value) {
? ? ? ? ? ?$box = $("<div>").addClass("box");
? ? ? ? ? ?$pic = $("<div>").addClass("pic").appendTo($box);
? ? ? ? ? ?$img = $("<img>").attr("src", "images/" + value.src).appendTo($pic);

? ? ? ? ? ?boxArr.push($box);

? ? ? ? ? ?$box.appendTo($("#main"));
? ? ? ?});

? ? ? ? //initBoxsPos(boxArr);
? ? ? ?waterfall(boxArr);
? ?}
});

主要考慮的是是否是第1批數(shù)據(jù)。第2批以上的數(shù)據(jù)都是依據(jù)“最小高度”去擺放。第1批數(shù)據(jù)的第1行特例。