瀑布流布局的特點(diǎn)：
【1】展示的圖片元素都是等寬不等高，圖片的位置用position:absolute定位來擺放闻丑。
【2】一行能擺放多少圖片的數(shù)量=獲取當(dāng)前窗口寬度/圖片固定寬度员魏。注意：獲取元素寬度是不要使用.width()，這種方法獲取的是div元素的content寬度疼电。使用$('.item').outerWidth(true) //獲取元素的整個寬度（內(nèi)容寬度+內(nèi)邊距+邊框+外邊距）
【3】圖片的擺放位置遵循規(guī)律：下一張圖片始終擺放在頁面中圖片高度之和最小的那一列下面筝尾，圖片位置水平方向=圖片數(shù)組索引號*圖片固定寬度，垂直方向位置=圖片數(shù)組索引號對應(yīng)的值（即當(dāng)前列的圖片高度之和）。圖片擺放后更新當(dāng)前列的所有圖片總高度良拼。
注意：該步驟可理解為，給定一個數(shù)組充边，在該數(shù)組中找出成員最小值和該成員在數(shù)組中的索引號庸推。首先假定數(shù)組中某個值為最小值，然后用for循環(huán)遍歷數(shù)組中的所有成員和假定最小值比較浇冰，如果某數(shù)組成員的值小于假定值贬媒，則獲取將該值（colSumHeight[i]）和對應(yīng)的索引號（i）。
【4】設(shè)置初始狀態(tài)數(shù)組肘习，數(shù)組長度等于當(dāng)前一行能擺放的圖片數(shù)际乘，該數(shù)據(jù)記錄每行中每張圖片的高度，數(shù)組的索引號記錄圖片在每行上第幾列的位置漂佩。每張圖片擺放后脖含，修改數(shù)組內(nèi)對應(yīng)索引號成員的值（即當(dāng)前列的高度之和）
預(yù)覽地址
代碼地址
