アイソトープ＆手動トリガー付き無限スクロール

Question

私は、無限スクロールプラグインでアイソトーププラグインを使用しています。 Infinite Scrollのデフォルト設定では新しい要素のロードが自動的に開始されますが、「Load more images」ボタンが表示されます。

私はisotope INSERT関数に渡すことができるInfiniteスクロールから新しい要素を取得する小さなコードを欠落しています。コードに以下の私のコメントを参照してください。

// initialize infinite scroll 
$container.infinitescroll({ 
    navSelector : '#paging', // selector for the paged navigation 
    nextSelector : '#paging a', // selector for the NEXT link (to page 2) 
    itemSelector : '.col',  // selector for all items you'll retrieve 
    loading: { 
     msgText: 'Loading...', 
     finishedMsg: Loaded all!', 
      } 
    } // <-- NOTE that we do not use callback function here! 
    ); 


$(window).unbind('.infscr'); 

$('#paging a').click(function(){ 

// NEED CODE HERE TO GET NEW ELEMENTS FROM INFINITE SCROLL AND PASS THOSE ELEMENTS TO $container.isotope('insert', $(newElements)); 

}); 

Answer 1

無限スクロールプラグインは、実際にあなたが後にしているだけで何やって"manual-trigger"-behaviorを提供しています。あなたは自動的にいないとき -

$container.infinitescroll({ 
    navSelector : '#paging', 
    nextSelector : '#paging a', 
    itemSelector : '.col', 
    behavior: 'twitter', 
    loading: { 
     msgText: 'Loading...', 
     finishedMsg: 'Loaded all!' 
    } 
    }, 
    // call Isotope as a callback 
    function(newElements) { 
    $container.isotope('appended', $(newElements)); 
    } 
);