필요에의해 갤러리형태의 게시판의 리스트를 무한으로 구현해야 했다.
잘 찾아보니 http://webpaper.kr/show/98&page=1&stx=%EC%8A%A4%ED%81%AC%EB%A1%A4 에서
개발 후 방법을 공유하신게 있어서 커스터마이징 후 기록을 위해 남김
게시판 스킨/list.skin.php 하단에 아래 코드를 넣어준다.
물론 게시판 형태에 따라 일부 수정은 해야한다.
게시판에 리스트 영역의 다음페이지를 불러와 코드를 붙이는 방식.
<script>
var total_page = "<?=$total_page?>";
var now_page = "<?=$page?>";
var roll_page = now_page;
$(window).scroll(function() {
var chkBtm = parseInt($(document).height()) - parseInt($(window).height());
if (chkBtm == $(window).scrollTop()) {
roll_page++;
if (roll_page <= total_page) {
callContent(roll_page, 'append');
}
} else if ($(window).scrollTop() == 0) {
now_page--;
if (now_page > 0) {
callContent(now_page, 'prepend');
}
}
});
function callContent(a, b) {
var url = "<?=G5_BBS_URL?>/board.php?bo_table=<?=$bo_table?>&page=" + a;
var tbody = "";
var thtml = "";
$.ajax({
type: "POST",
url: url,
dataType: "html",
success: function(html) {
tbody = html.split('<article>');
thtml = tbody[1].split('</article>');
setTimeout(function() {
if (b == 'append') {
// $(".tbl_head01").find('tbody').append(thtml[0]);
$("#fboardlist").append(thtml[0]);
}
}, 1000);
},
error: function(xhr, status, error) {
alert(error);
}
});
}
</script>아래는 최하단 스크롤 부분.
$(window).scroll(function(){
// 최하단일 경우를 체크하기 위해 최하단 위치값을 지정
// 화면 문서전체의 길이에서, 현재 창 높이를 뺀 것이 최하단 값
var chkBtm = parseInt($(document).height()) - parseInt($(window).height());
if(chkBtm == $(window).scrollTop()){
// 최하단으로 도달했을 경우
console.log('바닥입니다!');
}else if($(window).scrollTop() == 0){
// 최상단으로 도달했을 경우
console.log('꼭대기입니다!');
}
});'공부 > Gnuboard' 카테고리의 다른 글
| [그누보드] 에러 로그 찍기 (0) | 2020.02.13 |
|---|---|
| [그누보드] 게시판 게시글 순서 변경하기 (0) | 2020.01.22 |
| [그누보드] 홈페이지 통째로 복사하기 (1) | 2019.12.01 |
| [그누보드] 게시판에 iframe 으로 네이버영상 안나올시에 조치 (0) | 2019.11.24 |
| [그누보드] 회원가입 시 아이디 중복체크하기 (0) | 2019.11.09 |
