当用户使用jquery向下滚动时如何显示两个div?

时间:2014-03-04 10:53:42

标签: javascript jquery

任何人都可以告诉我当用户使用jquery向下滚动时如何显示两个div。我想在数组上推送值。是否可以在底部添加div。我们在用户滚动到顶部时添加?

http://jsfiddle.net/Gbd3z/2/

$("#fullContainer").scroll(function () {
    // top
    if ($(this).scrollTop() === 0 && pages.length) {
        console.log("up"+pages);
        var stringLoad = "page_" + pages.length;
        $("<div id='" + stringLoad + "'>" + pages.pop() + "</div>").prependTo($("#fullContainer"));
        $('#fullContainer').children().slice(3).remove()
    }
    if ($(this).scrollTop() >= $(this)[0].scrollHeight - document.body.offsetHeight) {
        console.log("down");
    }
});

1 个答案:

答案 0 :(得分:1)

我不完全确定你要求的是什么,但是这样做了吗?

http://jsfiddle.net/luken/R24TH/

var pages = [page_1, page_2, page_3, page_4,page_5];
var lastLoadedPageIndex = -1;
var $container = $('#fullContainer');
addNextPageToContainer();

function addNextPageToContainer () {
    lastLoadedPageIndex++;
    if (lastLoadedPageIndex < pages.length) {
       $( '<div id="page_'
                  + lastLoadedPageIndex
                  + '" class="page">' 
                  + pages[lastLoadedPageIndex]
                  + '</div>'
       ).slideDown().appendTo( $container );
   }
}

$container.scroll(function(){
    if ($container.scrollTop() === 0 && pages.length) {
        console.log("up");
    } else if ($container.scrollTop() >= $container[0].scrollHeight - document.body.offsetHeight) {
        console.log("down");
        addNextPageToContainer();
    }
 });