无限滚动分页 [英] Infinite Scrolling Paging

问题描述

谁能告诉我如何为$ flickr-> call('flickr.photos.search')实施无限滚动分页；我已经登录了用户，并显示了前10张照片. 现在，如何实现对剩余照片的滚动分页.

Can anyone tell how to implement Infinite Scrolling Paging for $flickr->call('flickr.photos.search'); I've the user logged in and the first 10 set of photos. Now how to implement scrolling paging for remaining photos.

我正在使用* Flickr API套件，该套件支持PHP> = 5.3.0的OAuth 1.0a. 和Codeigniter

I am using * Flickr API Kit with support for OAuth 1.0a for PHP >= 5.3.0. And Codeigniter

任何帮助将不胜感激....

Any Help would be appreciated....

推荐答案

为包含设计中的故事的div提供唯一的ID值，并使用Jquery使用Ajax Post将其值发布到控制器中，然后检索下一组Flickr数据. 得到结果后，将其追加到最后一个div下方.

Give unique id value for the div that contains the story in your design and use Jquery to Post the value to your controller using Ajax Post then retrieve next set of Flickr data. Once you've the results append it below the last div.

您的查看页面如下:

<div class="flickr_container">       
<div class="flickr_myphotos" id="<?php echo $fli; ?>">
{your flickr photos here }
</div>

<div class="flickr_myphotos" id="<?php echo $fli; ?>">
{your flickr photos here }
</div>
.........
</div>

您的Jquery Scroll事件如下:

Your Jquery Scroll event looks like:

$('.container').bind('scroll', function(){

if($(".container").scrollTop() + $(".container").innerHeight()>=$(".container")[0].scrollHeight)
    {

            var LastDiv = $(".flickr_myphotos:last");
            var LastId  = $('.flickr_myphotos').last().attr('id');
            var dataString = 'LastId='+ LastId ;

            if(dataString){
                $.ajax({
                type: "POST",
                url: "{ Controller here }",
                data: dataString,
                cache: false,
                success: function(html){
                LastDiv.after(html);

                });
}

以及您的控制器功能:

$parameters = array('user_id' => {USER ID HERE} ,'per_page' => 10,'page' => $page); $result = $flickr->call('flickr.photos.search', $parameters);

$parameters = array('user_id' => {USER ID HERE} ,'per_page' => 10,'page' => $page); $result = $flickr->call('flickr.photos.search', $parameters);

将结果放入视图

<div class="flickr_myphotos" id="<?php echo $fli; ?>">
{your flickr photos here }
</div>

这篇关于无限滚动分页的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！