当用户滚动到给定div的底部时如何追加div？ [英] how to append div when user scroll to bottom of given div?

问题描述

我做了一个简单的演示，我只显示了两个div。当用户向上滚动它创建一个div并且前置退出div.when用户再次滚动它再次创建一个div，并删除最后一个div（因为我想要显示在两个div）。但是我很震惊我从div下来我想要附加我删除的div。



我举个例子当我加载page_5然后向上滚动page_4加载，再次page_3加载并删除page_5。现在如果我想要关闭我想删除page_3并加载page_5并且page_4已经加载。



我们能做到这个功能吗？在这里，我正在尝试，但没有成功..

http://jsfiddle.net/N5LZB/7/ [ ^ ]

 var pages = [page_1，page_2，page_3，page_4，page_5]; 
 var backupPages = new Array（）; 
 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））; 
 
 //删除第二个索引处的元素
 $（' #fullContainer'）。children（）。slice（2）.remove（）
} 
 if（$（this）.scrollTop（）> = $（this）[0] .scrollHeight  -  document .body.offsetHeight）{
 console.log（down+ $（'＃full Container div：last-child'）。attr（'id'））; 
} 
}）; 

解决方案

（< div id =' + totalPage +' > + pages.pop（）+< / div > ）prependTo（

（ ＃fullContainer ））;

（ ＃fullContainer）滚动（function（）{
// top
if（

I am make a simple demo where I am showing only two divs.When user scroll up it create a div and prepend to exiting div.when user scroll again it again create a div , and remove the last div (because i want to show on two div).But I am struck my i come down bottom of the div I want to append the divs which i remove .

I take example when I load "page_5" then scroll up "page_4" load , again "page_3" load and remove "page_5" .Now if I want to come down I want to remove "page_3" and load "page_5" with page_4 already load.

can we do that functionality ? here I am trying but not getting success ..
http://jsfiddle.net/N5LZB/7/[^]

var pages = [page_1, page_2, page_3, page_4, page_5];
var backupPages=new Array();
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"));

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

解决方案

("<div id='" + totalPage + "'>" + pages.pop() + "</div>").prependTo(

("#fullContainer"));

("#fullContainer").scroll(function () { // top if (

这篇关于当用户滚动到给定div的底部时如何追加div？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！