jQuery Wookmark插件无限加载/Scoll [英] jquery Wookmark Plugin Infinite Load/Scoll

问题描述

我正在为我的网站使用Wookmark jQuery网格布局.

Im using the Wookmark jQuery grid layout for my website.

https://github.com/GBKS/Wookmark-jQuery

我需要自动加载/无限滚动.

I need the auto load/endless scroll working.

在该示例中，它仅再次加载了前10张图像，如何使其继续加载Wookmark.com和Pinterest.com上的列表的其余部分?

In the example it simply just loads the first 10 images again, how do you make it continue loading the rest of a list as on Wookmark.com and Pinterest.com?

香港专业教育学院一直试图更改的代码部分:

The code part that ive been trying to change:

/**
 * When scrolled all the way to the bottom, add more tiles.
 */
function onScroll(event) {
  // Check if we're within 100 pixels of the bottom edge of the broser window.
  var closeToBottom = ($(window).scrollTop() + $(window).height() > $(document).height() - 100);
  if(closeToBottom) {
    // Get the first then items from the grid, clone them, and add them to the bottom of the grid.
    var items = $('#tiles li');
    var firstTen = items.slice(0, 10);
    $('#tiles').append(firstTen.clone());

    // Clear our previous layout handler.
    if(handler) handler.wookmarkClear();

    // Create a new layout handler.
    handler = $('#tiles li');
    handler.wookmark(options);
  }
};

先谢谢了.我已经到处环顾四周，尝试了一些不同的尝试，但是没有运气.干杯.

Thanks in advance. Ive looked around everywhere and tried a few different things, but no luck. Cheers.

推荐答案

我刚刚向GitHub存储库添加了一个有关如何执行此操作的示例.该示例从Wookmark API加载数据并在页面上显示图像.向下滚动并到达底部时，它将加载更多内容.

I just added an example to the GitHub repository on exactly how to do this. The example loads data from the Wookmark API and displays the images on the page. When you scroll down and reach the bottom, it loads more.

这是示例的直接链接: https://github. com/GBKS/Wookmark-jQuery/tree/master/example-api

Here's the direct link to the example: https://github.com/GBKS/Wookmark-jQuery/tree/master/example-api

让我知道这对您有何帮助.

Let me know how this works out for you.

这篇关于jQuery Wookmark插件无限加载/Scoll的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！