问答详情
源自:3-2 jQuery实现瀑布流布局的图片加载功能

为什么我的控制台毫无反应?

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

waterfall();

var dataInt={"data":[{"src":'0.jpg'},{"src":"1.jpg"},{"src":"2.jpg"},{"src":"3.jpg"}]};

$(window).on('scroll',function(){

if(checkScrollSlide){

$.each(dataInt.data,function(key,value){

//var oBox=$('<div>').addClass('box').appendTo($('#main'));

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

//$('<img>').attr('src','images/'+)

console.log(value);

})

}

})

})


function waterfall(){

var $boxs=$('#main>div');

var w=$boxs.eq(0).outerWidth();

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

$('#main').width(w*cols).css('margin','0 auto');

var hArr=[];

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

//console.log(index);

//console.log(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);

//console.log(value);

$(value).css({//将dom对象value转换为jQuery对象

'position':'absolute',

'top':minH+'px',

'left':minHIndex*w+'px'

})

hArr[minHIndex]+=$boxs.eq(index).outerHeight();

}

})

//console.log(hArr);

}


function checkScrollSlide(){

var $lastBox=$('#main>div').last();

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

var scrollTop=$(window).scrollTop();

var documentH=$(window).height();

return (lastBoxDis<scrollTop+documentH)?true:false;

}

---------------------------------------------------------------------

http://img.mukewang.com/57295e61000169ff03260187.jpg

提问者:Python程序猿 2016-05-04 10:29

个回答

  • Python程序猿
    2016-05-05 19:49:39

    360

  • 188_整垮互联网
    2016-05-05 13:09:39

    是谷歌浏览器吗?