div에 무한스크롤 적용하기 질문입니다.
본문
모바일로 썼더니 소스를 못 넣어서 다시 올려요
divBodyScroll 라는 div 에 overflow-y:scroll 이 적용되어 있구요
search_data_table 라는 테이블이 divBodyScroll 안에 있습니다.
지금 작동은 되는데 133이라는 표 헤더 부분을 빼줬더니 동작이 되다가 말다가 하네요
무한 스크롤 소스가 document.height == window.height + window.scrolltop 으로 계산되서 스크롤이 끝에 닿으면
나오게 하는건 알겠는데요.
제가 만든 소스에서는 document 가 없는 div의 스크롤이 끝에 닿으면 동작되어야 하다보니
계산이 안 맞더라고요;;
어떻게 해야 하나요?
스크립트 소스입니다.
// divBodyScroll의 스크롤이 동작할때에 함수를 불러옵니다.
$('#divBodyScroll').scroll(function () {
var current_mode = document.getElementById('current_mode').innerText;
//스크롤 끝까지 닿으면 새로운 데이터 50개를 불러온다
var dh = $('#search_data_table').height();
var wt = $('#divBodyScroll').scrollTop();
if (dh == (wt+133)) {
start += list;
if(current_mode == '0'){
append_list();
}else{
append_list_detail();
}
}
//스크롤 끝까지 닿으면 새로운 데이터 50개를 불러온다 끝
});
해당 div 소스입니다.
<div id="divHeadScroll">
<table id="tblHead" border="0" >
<colgroup>
<col style="width:69px;" />
<col style="width:90px;" />
</colgroup>
<tr>
<th>제목</th>
<th>내용</th>
</tr>
</table>
</div>
<div id="divBodyScroll">
<table id="tblBody" border="0">
<tr id="search_data_table">
</tr>
</table>
</div>
답변을 작성하시기 전에 로그인 해주세요.
