javascript - 向下滚动时扩展网站？

Question

有人对如何自动扩展网站有建议吗？

例如，网站“9gag.com”也称为 9fag。它将一部分加载到浏览器中，但是当您滚动时，该站点会自行扩展，而无需单击“下一个站点”。

我喜欢在我创建的商店中使用它。

例如这里：

http://saasil.de/wohnraumleuchten/deckenleuchten/

向下滚动时，您会看到可以选择转到第二个站点...

如果有人能指出我在这里使用的正确技术，那就太好了。

Answer 1

看看这个关于 SO 的问题。在此示例中，页面将在到达页面底部之前扩展 100 像素

function loadMore()
{
    console.log("More loaded");
    // load your content (e.g. via ajax)
    $("body").append("<div>");
    $(window).bind('scroll', bindScroll);
}

function bindScroll()
{
    if($(window).scrollTop() + $(window).height() > $(document).height() - 100) 
    {
        $(window).unbind('scroll');
        loadMore();
    }
}

$(window).scroll(bindScroll);​

感谢乔弗莱奇！

Answer 2

正如上面评论中提到的那样，您正在寻找无限滚动。有很多 jQuery 插件可以帮助你达到想要的效果。当然，如果您正在动态加载内容，您可以使用 AJAX 获取数据。

Twitter、Pinterest 等也使用了类似的技术，当然还有 9gag。您可以在http://www.fieg.nl/infinite-ajax-scroll-a-jquery-plugin看到解释和工作演示