无限滚动的同位素

Question

我在主页上使用了过滤后的投资组合。我用一个小教程实现了同位素，但我无法将它与无限滚动结合起来。

对于同位素，我正在使用此代码：

jQuery(document).ready(function () {
var $container = jQuery('.fix-portfolio .items');
$container.imagesLoaded(function () {
    $container.isotope({
        itemSelector: '.item',
        layoutMode: 'fitRows'
    });
});

$container.infinitescroll({
navSelector: ".pagination",
nextSelector: ".pagination a[rel=next]",
itemSelector: ".item",
    loading: {
        finishedMsg: 'No more items to load.',
        img: 'http://i.imgur.com/qkKy8.gif'
    }
}, function (newElements) {
$container.isotope('appended', $(newElements));
});


jQuery(window).on('resize', function () {
    jQuery('.fix-portfolio .items').isotope('reLayout')
});

插件已加载，我的控制台中没有显示任何错误。我为自定义查询加载它可能是个问题吗？

if ( $portfolio_query->have_posts() ) : while ( $portfolio_query->have_posts() ) : $portfolio_query->the_post();
endwhile;else :endif;wp_reset_query();
            ?>

我希望我能够以更详细的方式解释我所做的事情。我也很困惑为什么我需要定义导航选择器，因为我认为页面会自动加载，当我滚动到容器的末尾时（对不起，正如我已经提到的，我是一个完全的 js 新手）。 谢谢你的帮助！ 问候，卡拉

Answer 1

使用 Isotope 可以实现无限滚动，但是如果没有看到更多代码，就很难判断代码的问题所在。如果您正在寻找有关如何使用 Isotope 实现无限滚动的信息，请查看此链接：http://isotope.metafizzy.co/v1/demos/infinite-scroll.html。

为了使用 Isotope 进行无限滚动，您需要使用 append 方法结合 Paul Irish 的 Infinite Scroll 插件来显示其他帖子。 Isotope 的开发者 David DeSandro 提到了这个特殊的插件。