百度搜索下结果看看

4444444444444444444444444444444444

不一样都是页面加载吗

你就不知道再套一层父级标签吗

已解决

为什么$(function(){waterfall();})就会重叠呢？而$(window).on('load',function(){waterfall();})就不会？

$(window).on('load', function () {
//取得图片整个容器DOM对象
var $boxs = $("#main>div");
// 一个图片框的宽
var w = $boxs.eq(0).outerWidth();
//每行能展示的图片列数
var cols = Math.floor($(window).width() / w);
//给最外围的main元素设置宽度和外边距
$('#main').width(w * cols).css('margin', '0 auto');
//并求出#main元素的左侧和页面边界的距离，供下面计算使用
var letPadding = ($(window).width() - cols * w) / 2;
//用于存储 每张图片容器高度。
var hArr = [];
$boxs.each(function (index, value) {
// 返回每个图片容器的高度值
var h = $boxs.eq(index).outerHeight();
//第一行图片的条件是 index < cols
if (index < cols) {
//每次给数组存入高度值
hArr[index] = h;
} else {
var minH = Math.min.apply(null, hArr);
var minHIndex = $.inArray(minH, hArr);
let leftPx = minHIndex * w + letPadding;
$(value).css({
'position': 'absolute',
'top': minH + 'px',
'left': leftPx + 'px'
})
//累计改变hArr中最小元素的高度值，直到$boxs数组最后一个元素完成时，结束
hArr[minHIndex] += $boxs.eq(index).outerHeight();
}
})
$('#main').width(w * cols).css('margin', '0 auto');
})

<b>大</b>

同样问题  怎么解决啊

老师两次提到了这个问题：$oBox是DOM对象，无法使用jquery的outerHeight()方法。.eq() 方法会用集合中的一个元素构造一个新的 jQuery 对象，这时候才能使用outerHeight()方法

最低高元素的高度+刚添加到最低高度下的元素的高度=新的列高;  特么还是我自己来回答好了

父盒子有设置相对定位吗？还有有没有居中？可能是这两条出问题了

没有区别吧，遍历到的都是同一个对象，获取方式不一样而已吧，用$boxs.eq(index) 感觉有点多此一举了

路过拿积分。。

应该是会变化的，可以刷新试试

你第二行字都不一样

直接贴代码比较妥吧~

一个是子选择器，一个是类选择器，他们选择的集合元素就不相同。

hArr[minIndex].left是undefined

第一个问题就我个人的认识来说, 可能每个浏览器引擎的实现方式都不同. ECMAScript制定javascrip语言的规范, 不同浏览器引擎去负责具体实现.

第二个问题, 上mdn, mozilla开发者网络.

$box是一个数组,包含很多个class为.box的对象，eq(0)是取他的第一个，$box.eq(0)相当于$box[0]

$('#main').width(w*cols).css('margin ','0 auto');//这句代码中的'margin '后面多出了一个空格符；所以报错应该写成'margin','0 auto')

查看浏览器开发者工具，如果出现 ‘Uncaught ReferenceError: $ is not defined’，可能是你的jQuery文件引用路径不对 或者是 在html中加载jQuery库文件顺序有误，jQuery库文件的引用顺序 优于 其他 js 文件的顺序。

position 拼错了，少个i

距离左边de距离？

你可以console.log(value)去看一下  这里的value指的是$boxs下的所有div盒子 在进行if(index<cols){}esle{}判断后就是指的除索引值index<cols的div盒子外的全部div盒子了  这解释不严谨  但是应该能理解

on事件在1.8以后才有，在此前用的是bing live等绑定方法，更新jquery

自己找到了，20行数组名写错......