// 数据格式
var testJson = {
"상태":1,
"데이터":[
{"href":"http:xxxxxxx","src":"
http://dummyimage.com/240x300/B5E61D/fff","너비":240,"높이":300,"이름":"그림 1"},
{"href":"http:xxxxxxx","src":"
http://dummyimage.com/240x210/333/fff","너비":240,"높이":210,"이름":"그림 2"},
{"href":"http:xxxxxxx","src":"
http://dummyimage.com/240x190/f60/fff","너비":240,"높이":190,"이름":"그림 3"},
{"href":"http:xxxxxxx","src":"
http://dummyimage.com/240x230/B5E61D/fff","너비":240,"높이":230,"이름":"그림 4"},
{"href":"http:xxxxxxx","src":"
http://dummyimage.com/240x280/B5E61D/fff","너비":240,"높이":280,"이름":"그림 5"},
{"href":"http:xxxxxxx","src":"
http://dummyimage.com/240x260/eee/fff","너비":240,"높이":260,"이름":"그림 6"},
{"href":"http:xxxxxxx","src":"
http://dummyimage.com/240x180/000/fff","너비":240,"높이":180,"이름":"그림 7"},
{"href":"http:xxxxxxx","src":"
http://dummyimage.com/240x240/B5E61D/fff","너비":240,"높이":240,"이름":"그림8"},
{"href":"http:xxxxxxx","src":"
http://dummyimage.com/240x265/B5E61D/fff","너비":240,"높이":265,"이름":"그림9"},
{"href":"http:xxxxxxx","src":"
http://dummyimage.com/240x245/259/fff","너비":240,"높이":245,"이름":"그림 10"},
{"href":"http:xxxxxxx","src":"
http://dummyimage.com/240x310/B5E61D/fff","너비":240,"높이":310,"이름":"그림 11"},
{"href":"http:xxxxxxx","src":"
http://dummyimage.com/240x210/B5E61D/fff","너비":240,"높이":210,"이름":"그림 12"},
{"href":"http:xxxxxxx","src":"
http://dummyimage.com/240x150/B5E61D/fff","너비":240,"높이":150,"이름":"그림 13"},
{"href":"http:xxxxxxx","src":"
http://dummyimage.com/240x165/B5E61D/fff","너비":240,"높이":165,"이름":"그림 14"},
{"href":"http:xxxxxxx","src":"
http://dummyimage.com/240x100/B5E61D/fff","너비":240,"높이":100,"이름":"그림 15"},
{"href":"http:xxxxxxx","src":"
http://dummyimage.com/240x280/B5E61D/fff","너비":240,"높이":280,"이름":"그림 16"},
{"href":"http:xxxxxxx","src":"
http://dummyimage.com/240x225/B5E61D/fff","너비":240,"높이":225,"이름":"그림 17"},
{"href":"http:xxxxxxx","src":"
http://dummyimage.com/240x210/B5E61D/fff","너비":240,"높이":210,"이름":"그림 18"},
{"href":"http:xxxxxxx","src":"
http://dummyimage.com/240x230/B5E61D/fff","너비":240,"높이":230,"이름":"그림 19"},
{"href":"http:xxxxxxx","src":"
http://dummyimage.com/240x210/B5E61D/fff","너비":240,"높이":210,"이름":"그림 20"},
{"href":"http:xxxxxxx","src":"
http://dummyimage.com/240x300/B5E61D/fff","너비":240,"높이":300,"이름":"그림 21"},
{"href":"http:xxxxxxx","src":"
http://dummyimage.com/240x210/333/fff","너비":240,"높이":210,"이름":"그림 22"},
{"href":"http:xxxxxxx","src":"
http://dummyimage.com/240x190/f60/fff","너비":240,"높이":190,"이름":"그림 23"},
{"href":"http:xxxxxxx","src":"
http://dummyimage.com/240x230/B5E61D/fff","너비":240,"높이":230,"이름":"그림 24"},
{"href":"http:xxxxxxx","src":"
http://dummyimage.com/240x280/B5E61D/fff","너비":240,"높이":280,"이름":"그림 25"},
{"href":"http:xxxxxxx","src":"
http://dummyimage.com/240x210/eee/fff","너비":240,"높이":210,"이름":"그림 26"},
{"href":"http:xxxxxxx","src":"
http://dummyimage.com/240x180/000/fff","너비":240,"높이":180,"이름":"그림 27"},
{"href":"http:xxxxxxx","src":"
http://dummyimage.com/240x240/B5E61D/fff","너비":240,"높이":240,"이름":"그림 28"},
{"href":"http:xxxxxxx","src":"
http://dummyimage.com/240x195/B5E61D/fff","너비":240,"높이":195,"이름":"그림 29"},
{"href":"http:xxxxxxx","src":"
http://dummyimage.com/240x245/259/fff","너비":240,"높이":245,"이름":"그림 30"}
]
}
var wallPic = function(){
var $target = $('#wallList'),
$li = $target.find('li'),
$tips = $('#loadTips'),
oTop = 0, //판정값 스크롤
행 = 3,//열 수
~ ~ .
url = 'xxxx', //ajax 요청주소
On_off = TRUE; // AJAX가 여러 번 데이터를 잘못 로드하는 것을 방지하기 위해 구조체의 스위치를 삽입합니다
반품{
fillData:function(콜백){
~ ~
on_off = 거짓;
/* 아약스
--------*/
// $.get(url,{ 페이지:페이지, 개수:30},function(json){
~ ~ //
~
~ //
~
~ ~
~ ~ //
// },'json');
/* 시뮬레이션 테스트 - 타이머 시뮬레이션 Ajax 요청 데이터 설정
---------------*/
setTimeout(function(){
// 시뮬레이션 종료
만약(페이지==3){
_that.loadedTips();
반품;
~
_that.appendHTML(testJson.data);
on_off = true;
},400);
},
추가HTML:함수(데이터){
var len = 데이터.길이,
n = 0;
for(;n
var k = 0;
n>(row-1)?k=n%row:k=n;
$li[k].innerHTML = '
' 데이터[n].name '';
}
this.getOTop();
},
getOTop:함수(){
oTop = Math.min.apply(null,[$li.eq(0).height(),$li.eq(1).height(),$li.eq(2).height()]) $target .offset().top;
},
로드된 팁:함수(){
$('#loadTips').find('span').text('数据已加载完');
setTimeout(함수(){
$('#loadTips').css({'visibility':'hidden'});
},200);
// 解绑事件
$(window).unbind('scroll',$.proxy(this.scrollEvent,this));
},
스크롤이벤트:함수(){
if($(document).scrollTop() $(window).height()>oTop&&on_off){
this.fillData();
}
},
초기화:함수(){
this.fillData();
$(window).bind('scroll',$.proxy(this.scrollEvent,this));
}
}
}();
wallPic.init();