• 0 رای - 0 میانگین
  • 1
  • 2
  • 3
  • 4
  • 5
لود داده های بیشتر به سبک فیس بوک
#1
سلام،
میدونم الآن خیلی از این شبکه های اجتماعی اینطوری داده لود میکنن ولی من اولین بار توی فیس بوک دیدم.

توی صفحه خانگی فیس بوک‌تون وقتی میرید، اسکرول میکنید میاد پایین تا میرسه جایی که پست ها تموم میشه ولی چیزی لود میشه بعد پست های جدید میاد. امروز صبح دیدم تاحالا ننوشتمش گفتم بنویسم ببینم چجوریه. این از آب در اومد،
کد:
<style type="text/css">
            .loadmore
            {
                width: 100px;
                height: 50px;
                background-color: gray;
                color: #fff;
            }
            .content
            {
                background-color: red;
                width: 100%;height: 100px;
            }
        </style>
<script>
            $(document).ready(function(){
                
                setInterval(function()
                {
                    var loadPositionTop = $(".loadmore").position().top;
                    var windowScrollTop = $(window).scrollTop();
                    var windowHeight = $(window).height();
                    var loadHeight = $(".loadmore").height();

                    if(loadPositionTop+loadHeight <= windowScrollTop+windowHeight)
                    {
                        $(".content:first-child").clone().appendTo("#container");
                    }
                },1000);
                
            });
        </script>
<body>
        <div id="container">
            <div class="content">این مثلا یه باکس با داده مورد نظر هست!</div>
        </div>
        <div class="loadmore">در حال خواندن داده های بیشتر</div>
    </body>
این چیزی که من نوشتم اینطوری عمل میکنه که اگر کل باکس خاکستری (ارتفاعش رو درنظر بگیرید) در صفحه قرار بگیره داده جدید لود میشه.
اگر کسی نمونه خارجی این سبکی دیده به منم معرفی کنه که برم ببینم چجوری نوشته شده. مرسی Heart
غایب
  پاسخ
تشکر شده توسط : oia ali786
#2
این الان کار میکنه؟
بنده طعم ايمان را نمي چشد، تا اينكه دريابد آنچه اتفاق نيفتاده است نمي شد كه اتفاق بيفتد؛و آنچه شده و اتفاق افتاده است,نمي شد كه نشود و اتفاق نيفتد....حضرت علي(ع)
  پاسخ
تشکر شده توسط :
#3
اره كار ميكنه داداش.
غایب
  پاسخ
تشکر شده توسط :
#4
http://www.infinite-scroll.com/

این paul irish واقعا معرکست Heart
  پاسخ
تشکر شده توسط : cyletech


پرش به انجمن:


کاربران در حال بازدید این موضوع: 1 مهمان