Load Content While Scrolling With jQuery

最新推荐文章于 2024-11-04 16:17:23 发布

anyanyu2851

最新推荐文章于 2024-11-04 16:17:23 发布

阅读量99

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/michael110/archive/2011/02/28/1967494.html

版权

转贴标记：

http://www.webresourcesdepot.com/load-content-while-scrolling-with-jquery/

demo

关键代码及实现思想：

Content structure is like:

<div class="wrdLatest" id=9>content</div>
<div class="wrdLatest" id=8>content</div>

We create a function sending a query to a dynamic file with the DIV ID of the latest wrdLatest DIV (and also put a loader image):

function lastPostFunc() 
{ 
    $('div#lastPostsLoader').html('<img src="bigLoader.gif">');
    $.post("scroll.asp?action=getLastPosts&lastID=" + $(".wrdLatest:last").attr("id"),     

    function(data){
        if (data != "") {
        $(".wrdLatest:last").after(data);            
        }
        $('div#lastPostsLoader').empty();
    });
};

When a user scrolls down, we understand that the scroller is at the bottom with teh function below and fire the lastPostFunc function.

$(window).scroll(function(){
        if  ($(window).scrollTop() == $(document).height() - $(window).height()){
           lastPostFunc();
        }
});

转载于:https://www.cnblogs.com/michael110/archive/2011/02/28/1967494.html