index的值好像沒(méi)取上,所有圖片跑到第一張下面去了
給main設(shè)置了1000px的寬,按照一行4列來(lái)排列,貌似index值沒(méi)有取上,所有圖片跑到第一張下面去了,應(yīng)該是在第4張下面的
window.onload?=?function(){ ????waterfall("main",?"box"); } //通過(guò)waterfall函數(shù)將存放每張圖片的盒子取出來(lái) function?waterfall(parent,?box){ ????var?oParent?=?document.getElementById("main");???? ????var?oBoxs?=?getClassBox(oParent,box);?????? ????var?pageW?=?oParent.offsetWidth;???? ????var?oBoxW?=?oBoxs[0].offsetWidth;???????? ????var?cols?=?pageW?/?oBoxW;???? ????var?hArr?=?[];???? ????for(var?i=0;?i<oBoxs.length;?i++){ ????????????if(i<cols){ ????????????????hArr.push(oBoxs[i].offsetHeight); ????????????}else{ ????????????????var?minH?=?Math.min.apply(null,?hArr); ????????????????var?index?=?getminhIndex(hArr,minH);???????????? ????????????????oBoxs[i].style.position?=?"absolute";???????????? ????????????????oBoxs[i].style.top??=?minH+"px";???????????? ????????????????oBoxs[i].style.left?=?oBoxW*index+"px";???????? ????????????} ????} } function?getClassBox(parent,?clsName){ ????var?boxArr?=?[];??//?創(chuàng)建數(shù)組boxArr用來(lái)存儲(chǔ)取出來(lái)的box ????var?oElements?=?parent.getElementsByTagName("*");?//創(chuàng)建變量oElements用來(lái)獲取main下的box集合???????? ????for(var?i=0;?i<oElements.length;?i++){???? ???????if(oElements[i].className?==?clsName){ ? ???boxArr.push(oElements[i]);???? ???? ???????}???? ????}????? ???????return?boxArr; }? //獲取第一行圖片中高度最小的盒子的索引號(hào) function?getminhIndex(arr,val){???? ????for(var?i?in?val){???????? ????????if(arr[i]==val){???????????? ????????????return?i;???????? ????????}???? ????} }
2019-10-24
"for
(
var
?i?
in
?val)" i應(yīng)該在arr中,寫錯(cuò)了,已解決?