oBoxs[i].style.left =oBoxW*index +'px';

沒有于高度最少的那一列對齊

而我是使用另一種方法：oBoxs[i].style.left =oBoxs[index].offsetLeft+ 'px'，就避免了問題

請問為什么會出現(xiàn)這樣的問題？

function waterfall(parent,box){
?? ?//將main下的所有class為box的元素取出來
?? ?var oParent = document.getElementById(parent);
?? ?var oBoxs =getByClass(oParent,box);
?? ?//計算整個頁面顯示的列數(shù)（頁面寬/box的寬）
?? ?var oBoxW = oBoxs[0].offsetWidth;
?? ?var cols =Math.floor(document.documentElement.clientWidth/oBoxW);
?? ?//設(shè)置maind的寬
?? ?oParent.style.cssText = 'width:'+oBoxW*cols+'px;margin:0 auto';
?? ?var ArrH=[];//存放每一列高度的數(shù)組
?? ?for(var i =0;i<oBoxs.length;i++){
?? ??? ?if(i<cols){
?? ??? ??? ?ArrH.push(oBoxs[i].offsetHeight)
?? ??? ??? ?
?? ??? ?}else{
?? ??? ??? ?var minH=Math.min.apply(null,ArrH);
?? ??? ??? ?var index =getMinhIndex(ArrH,minH);
?? ??? ??? ?oBoxs[i].style.position ='absolute';
?? ??? ??? ?oBoxs[i].style.top =minH+'px';
?? ??? ??? ?oBoxs[i].style.left =oBoxW*index +'px';
?? ??? ??? ?//oBoxs[i].style.left =oBoxs[index].offsetLeft+ 'px';
?? ??? ??? ?//ArrH[index] +=oBoxs[i].offsetHeight;
?? ??? ?}
?? ?
?? ?}
?? ?console.log(ArrH);
}