스크롤바를 이용한 페이징

참고 사이트: http://aroskr.tistory.com/112

샘플 파일:

Data.html

HTMLPage.html

 var scrollCurrentTop = 0;

        var pageCounter = 10;

        //스크롤 감시자

        $(window).scroll(function () {

            if (($(window).scrollTop() == $(document).height() - $(window).height()) && $(window).scrollTop() != scrollCurrentTop) {

                scrollCurrentTop = $(window).scrollTop();

                $.addData();

            }

        });

        $.extend({

            //페이징

            addData: function () {

                //$("div#dataLoaderImage").html("<img src='/bigLoader.gif'>");

                var result = $.ajax({

                    url: "/Mytrip/timeline_list.php?pageCounter=" + pageCounter,

                    dataType: "html"

                });

                result.success(function (data) {

                    if (data != "") {

                        $("div#addData").append(data);

                        //$("div#dataLoaderImage").empty();                        

                        pageCounter += 10;

                        $("input[name=counterNumber]").val(pageCounter);

                        //댓글 이벤트 생성자

                        $("input[name=reply]").unbind("keypress", $.commentsClickEvent());

                        $.commentsClickEvent();

                    }

                });

            },

<div id="addData" currentpagesize="<?php echo($pageSize);?>"></div>

<div id="dataLoaderImage"></div>