如何一次只显示两个div?

时间:2014-03-04 09:34:38

标签: javascript jquery

你可以告诉我如何及时展示两个div吗? 实际上我做了一个演示,我滚动到顶部它创建一个div并前置到主div。但我想一次只有两个div显示。现在每当用户进入top时它将创建新的div。我希望用户删除div下面。

Example on starting : it show On div id="page_5"
when user scroll up it create  div id="page_4" .It is fine
But when user scroll again it create  div id="page_3" but that time I need user delete that div id="page_5" from below.again user go up it remove div id="page_4".


if user come down it remove upper div and show below div .remove remove div id="page_1" or remove div id="page_2" and show div id="page_5" or div id="page_4"

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

var pages = [page_1, page_2, page_3, page_4,page_5];
 var totalPage = "page_" + pages.length;
$("<div id='" + totalPage + "'>" + pages.pop() + "</div>").prependTo($("#fullContainer"));


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

1 个答案:

答案 0 :(得分:0)

尝试

$("#fullContainer").scroll(function () {
    // top
    if ($(this).scrollTop() === 0 && pages.length) {
        console.log("up");
        var stringLoad = "page_" + pages.length;
        $("<div id='" + stringLoad + "'>" + pages.pop() + "</div>").prependTo($("#fullContainer"));

        //remove element at 2nd index
        $('#fullContainer').children().slice(2).remove()
    }
    if ($(this).scrollTop() >= $(this)[0].scrollHeight - document.body.offsetHeight) {
        console.log("down");
    }
});

演示:Fiddle