무한스크롤 최신버젼으로 적용 정보
무한스크롤 최신버젼으로 적용본문
무한스크롤이 필요해서 가져왔는데... 본 링크를 잃어버렸네요;;
제작자 분 말씀해주시면 바로 적용하겠습니다.
현재 그누에 적용하면 바로 되니 해보세요.
경로 : skin/board/basic/list.skin.php
빨간색 : 추가 해야되는 부분
-----
<ul id="ajax_data"> << UL 혹은 테이블 방식은 TD에 아이디 값 적용
<?php
for ($i=0; $i<count($list); $i++) { << 위에 적용
?>
-----
<div class="more_button">더보기 more</div> // 어디에 적용해도 상관없겠죠?ㅎ
<?php if ($list_href || $is_checkbox || $write_href) { ?> << 위에 적용
-----
<?php if (count($list) == 0) { echo '<li class="empty_table" datano="no">게시물이 없습니다.</li>'; } ?> << datano="no 추가
-----
맨하단 스크립트에 추가
// 최대한 기존꺼 건들지 않기 위함
// 게시판 로드 후 하단 페이지 1번을 2로 설정
// 2로 변경 없이 무한스크롤 진행시 1번을 다시 불러와 기존에 보인 게시글과 중복됨!
// 추가 수정하여 게시글이 적어 하단 페이지이동이 없는 경우도 체크함
var page_on = $("#container").find(".pg_current");
var page_check = $(".pg_current").text();
$(document).ready(function () {
if (page_check == "object Object") {
$(".pg_current").text("0");
} else {
$(".pg_current").text("2");
}
});
// 더보기 버튼 클릭시 이벤트
// 만약 작동안할시에 하단 .pg_current를 찾아보셔야 합니다. 게시판 밑 번호 써있는곳
//
// △ F12 개발자도구로 해당 버튼 클릭 후 클래스값으로 변경해주면됨 그리고 버튼 display:none 설정
$(".more_button").click(function(){
$( this ).html('<i class="fa fa-spinner fa-spin"></i>');
var disp_li_length = $("#gallery_json > li").length;
var page_n = $(".pg_current").html();
$.get("<?=G5_URL?>/bbs/board.php?bo_table=<?=$bo_table?>&ajax_ck=1&sca=<?php echo urlencode($sca) ?>&page="+page_n, function( data ) {
var append_data = $(data).find("#ajax_data").html();
var cking = $(data).find(".empty_table").attr("datano");
if (page_check == 0) {
$(".more_button").html("더 이상 게시글이 없습니다.");
return false;
}
if (cking != "no"){
$("#page_txt").html("");
$("#ajax_data").append(append_data);
$(".pg_current").html(parseInt(page_n)+1);
$(".more_button").html("더 보기");
} else {
$(".more_button").html("더 이상 게시글이 없습니다.");
}
});
});
4
댓글 10개
온클릭으로 변경하거나 해당 a 태그만 무효화 처리 안되게 해야될것 같습니다.
감사합니다~~
더보기 클릭해야 작동하는 건가요?