你把JS和JQ文件放到body最后面就可以了。

你的问题解决了吗？

我也是出现同样的问题，我的跟老师的代码的区别，只是给main在css上设置了固定的宽度，不随浏览器窗口大小变化而改变列数。

$oImg=$('<img>').attr("src","images/"+val.src).appendTo($oPic)这句代码写错了，应该这样写：

$oImg=$('<img>').attr("src","images/"+$(val).attr('src')).appendTo($oPic)  val是DOM元素，要把它转化成jquery元素，然后用jquery方法获取它的值

你试一下把 scrollslide()函数返回的条件改一下.

return (lastH<=scrollH) ? true : false ;

$(window).on("load",function() {

waterfall();

var dataInt={"data":[{"src":"23.jpg"},{"src":"24.jpg"},{"src":"25.jpg"},{"src":"26.jpg"},{"src":"27.jpg"},{"src":"28.jpg"},{"src":"29.jpg"},{"src":"30.jpg"},{"src":"31.jpg"},{"src":"32.jpg"},{"src":"33.jpg"},{"src":"34.jpg"},{"src":"35.jpg"},{"src":"36.jpg"},{"src":"37.jpg"},{"src":"38.jpg"},{"src":"39.jpg"},

{"src":"40.jpg"},{"src":"41.jpg"},{"src":"42.jpg"},{"src":"43.jpg"},{"src":"44.jpg"},{"src":"45.jpg"},{"src":"46.jpg"},{"src":"47.jpg"},{"src":"48.jpg"},{"src":"49.jpg"},{"src":"50.jpg"},{"src":"51.jpg"},{"src":"52.jpg"},{"src":"53.jpg"},{"src":"54.jpg"},{"src":"55.jpg"},{"src":"56.jpg"},{"src":"57.jpg"},{"src":"58.jpg"},

{"src":"59.jpg"},{"src":"60.jpg"},{"src":"61.jpg"},{"src":"62.jpg"},{"src":"63.jpg"},{"src":"64.jpg"},{"src":"65.jpg"},{"src":"66.jpg"},{"src":"67.jpg"},{"src":"68.jpg"},{"src":"69.jpg"},{"src":"70.jpg"},

{"src":"71.jpg"},]};

$(window).scroll(function() {

if(scrollside()) {

$.each(dataInt.data, function(index, val) {

$oBox=$('<div>').addClass('box').appendTo('#content');

$oPic=$('<div>').addClass('pic').appendTo($oBox);

$oImg=$('<img>').attr("src","images/"+val.src).appendTo($oPic);

});

waterfall();

}

});

});

function waterfall(){

var $box=$("#content>div");

var wbox=$box.eq(0).outerWidth();

var cols=Math.floor($(window).width()/wbox);

$("#content").width(wbox*cols).css("margin","0 auto");

var Harry=[];

$box.each(function(index, value) {

var h=$box.eq(index).outerHeight();

if(index<cols){

Harry[index]=h;

}

else{

var minH=Math.min.apply(null,Harry);

var minIndex =$.inArray(minH,Harry);

$(value).css({"position":"absolute","left":minIndex*wbox+"px","top":minH+"px",});

Harry[minIndex]+=$box.eq(index).outerHeight();

}

});

}

function scrollside(){

var $lastBox=$("#content>div").last();

var lastH=$lastBox.offset().top+Math.floor($lastBox.outerHeight()/2);

var scrollH=$(window).scrollTop()+$(window).height();

return (scrollH>lastH)?true:false;

}

是不是代码问题呢 贴出来看看