$(window).on("load",function(){
	waterfall();
	var dataInt = {"data":[{"src":"P_00.jpg"},{"src":"P_01.jpg"},{"src":"P_02.jpg"}]};
	$(window).on('scroll',function(){
		if(checkScrollSlide()){
			$each(dataInt.data,function(key,value){
				//console.log(value);
				var oBox = $('<div>').addClass('box').appendTo($("#main"));
				var oPic = $('<div>').addClass('pic').appendTo($(oBox));
				$('<img>').attr('src','images/'+$(value).attr('src')).appendTo(oPic);
				
				//console.log($(value).attr('src'));
			})
			waterfall();
		}
	})
})
function waterfall(){
	var $boxs = $('#main > div');
	var w = $boxs.eq(0).outerWidth();//outerWidth 可以获取加padding margin的宽
	var cols = Math.floor($(window).width()/w);
	$("#main").width(w*cols).css("margin","0 auto");//不需要设置单位
	var hArr = [];
	$boxs.each(function(index,value){
		var h = $boxs.eq(index).outerHeight();
		if(index<cols){
			hArr[index] = h;
		}else{
			var minH = Math.min.apply(null,hArr);
			var minHIndex = $.inArray(minH,hArr);
			$(value).css({
				'position' : 'absolute',
				'top' : minH+'px',
				'left' : minHIndex*w + 'px'
			})
			hArr[minHIndex]+= $boxs.eq(index).outerHeight();
		}
	})
	//console.log(index);
}

function checkScrollSlide(){
	var $lastBox = $('#min>div').last();
	console.log($lastBox);
	var lastBoxDis = $lastBox.offset().top + Math.floor($lastBox.outerHeight()/2);
	var scrollTop = $(window).scrollTop();
	var documentH = $(window).height();
	return (lastBoxDis < scrollTop + documentH)?true : false;
}