同位素與無限滾動

-1

我在我的主頁上使用過濾後的投資組合。我用一個小教程實現了同位素，但是我無法將它與無限滾動結合起來。同位素與無限滾動

同位素我用這個代碼：

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 newby）。感謝您的幫助！問候，卡拉

來源

2014-08-28 CaraMar

您需要提供更多信息才能提供幫助。你的無限滾動是如何工作的？結構是什麼樣子？你有什麼特別的麻煩？ – 2014-08-28 14:04:56

對不起，我的請求不完整。我正在研究同位素和無限滾動，並且發現了數百種不同的解決方案和教程，這些解決方案和教程對我來說都很困惑，因爲我正要在js中開始我的第一步。 ndiego的這些基本信息已經給了我一個很好的開始。 – CaraMar 2014-08-28 19:22:35

所以我嘗試@ndiegos方法，它再次無法正常工作。我希望沒關係，當我編輯上面的第一篇文章並嘗試以更詳細的方式解釋。 – CaraMar 2014-09-01 11:15:36

無限滾動是可能的同位素，但沒有看到更多的代碼很難說你的代碼問題在哪裏。如果您正在尋找有關如何使用同位素進行無限滾動的信息，請查看此鏈接：http://isotope.metafizzy.co/v1/demos/infinite-scroll.html。

爲了使無限滾動使用同位素，您需要使用append方法來顯示額外的帖子，以及類似於由愛爾蘭人Paulópolis的Infinite Scroll插件。 Isotope的開發者David DeSandro提到了這個特殊的插件。

來源

2014-08-28 14:15:22 ndiego

請提供一些鏈接提供的信息，而不僅僅是鏈接。如果這些網站出現故障，我們希望您的答案仍然有用 – 2014-08-28 19:24:53

同位素與無限滾動

回答

相關問題