window.onload?=?function(){
	waterfull('main','box');
}

function?waterfull(parent,box){
	var?oParent?=?document.getElementById(parent);
	var?oBox?=?getByClass(oParent,box);
	var?oBoxW?=?oBox[0].offsetWidth;
	var?clos?=?Math.floor(document.?documentElement.clientWidth/oBoxW);
	oParent.style.cssText?=?'width:'+oBoxW*clos+'px;margin:0?auto;';

	var?hArr?=?[];//存放每列高度的數組
	for?(var?i?=?0;?i?<?oBox.length;?i++)?{
		if(i<clos){
			hArr[i]?=?oBox[i].offsetWidth;//先把高度插進數組?
		}else{
			var?minH?=?Math.min.apply(null,hArr);
			var?index?=?getMinhIndex(hArr,minH);
			oBox[i].style.postion?=?'absolute';
			oBox[i].style.top?=?minH+'px';
			//oBox[i].style.left?=?index*oBoxW+'px';
			oBox[i].style.left?=?oBox[index].offsetLeft+'px';
			hArr[index]+=oBox[i].offsetHeight;
		}
	}
}

function?getByClass(parent,className){
	var?boxArr?=?[],//用來存儲獲取到的所有class為box的元素
		oElement?=?parent.getElementsByTagName('*');
	for?(var?i?=?0;?i?<?oElement.length;?i++)?{
		if(oElement[i].className?==?className){
			boxArr.push(oElement[i]);
		}
	};
	return?boxArr;
}

function?getMinhIndex(arr,val){
	for(var?i?in?arr){
		if(arr[i]?==?val){
			return?i;
		}
	}
}