如何正确使用jQuery Isotope + Infinite滚动?

时间:2014-11-24 17:00:56

标签: jquery jquery-isotope infinite-scroll

我试图实施同位素+无限卷轴 同位素站点上唯一可用的文档是以下代码示例,我不知道同位素如何知道从哪里提取数据。
无限滚动插件页面也解释不了多少。

是否在查询 nextSelector ,因为其href知道从何处提取数据?
我在滚动时没有看到 #page_nav a 的变化,所以我对此感到困惑。
navSelector 用于什么?

http://isotope.metafizzy.co/v1/demos/infinite-scroll.html中的代码:

<nav id="page_nav">
  <a href="../pages/2.html"></a>
</nav>

<script src="../js/jquery-1.7.1.min.js"></script>
<script src="../jquery.isotope.min.js"></script>
<script src="../js/jquery.infinitescroll.min.js"></script>
<script>
  $(function(){

    var $container = $('#container');

    $container.isotope({
      itemSelector : '.element'
    });

    $container.infinitescroll({
      navSelector  : '#page_nav',    // selector for the paged navigation 
      nextSelector : '#page_nav a',  // selector for the NEXT link (to page 2)
      itemSelector : '.element',     // selector for all items you'll retrieve
      loading: {
          finishedMsg: 'No more pages to load.',
          img: 'http://i.imgur.com/qkKy8.gif'
        }
      },
      // call Isotope as a callback
      function( newElements ) {
        $container.isotope( 'appended', $( newElements ) ); 
      }
    );


  });
</script>

0 个答案:

没有答案