1

所以我正在尝试实现流行的无限滚动插件来替换我当前自制的无限滚动脚本:

http://www.infinite-scroll.com/ & https://github.com/paulirish/infinite-scroll

无论如何,这个插件似乎需要在页面上有 html 分页。即由于这些选项:

nextSelector: "div.navigation a:first",
navSelector: "div.navigation",

我的页面上没有分页标记。我不在乎我的网站是否与爬虫/js 禁用用户不兼容。

那么有没有办法在没有物理 html 分页的情况下实现这个插件呢?

在我的自定义脚本中,我正在做类似的事情:

var $page = 1;

// Load content for $page

$page++;

像这样的任何东西,即我可以将起始页作为整数传递吗?

4

2 回答 2

1

看看这个非常简化的无限滚动版本,它不需要任何分页元素。

http://www.innovativephp.com/demo/infinitescroll/

于 2013-02-21T03:01:20.293 回答
1

您可以使用 jQuery/javascript 轻松创建它。

现在写一个通用的东西有点困难,但主要原则是:

如果您正在加载最新的内容(最新的优先,旧的滚动):

  1. 加载比屏幕高度多一点的第一组元素(无论是博文、图片、引号)。将最后一项的 ID 保存在变量中。

  2. 使用 setInterval 检测用户是否滚动页面,然后加载 ID 低于您保存的最后一个 ID 的数据。然后继续保存最后一个 ID 并加载新内容。

祝你好运!

像这样的东西:

function loadnewdata()
{
    // do ajax stuff, update data.
}
setInterval(
  function (){
    if(($(document).height() - $(window).height() - $(document).scrollTop()) < 500){
    loadnewdata();
    }
  }, 
  500
);

当然,您会为自己编写 loadNewData() 函数。取决于你的数据。如果用户滚动了页面,这将每 500 个加载新数据。

于 2013-02-21T14:13:13.360 回答