jQuery Masonryで無限のスクロールを追加するにはどうすればよいですか？

Question

jQuery Masonryの種類を使用している私の現在のWebサイトに無限のスクロールを組み込もうとしています。私はJavaScriptと（一般的にはHTMLの）基本的な機能と言語を理解しようとしていますが、かなり圧倒的になることがあります。私はまた、PHPの使用を含むWebページに無限のスクロールを追加するさまざまな方法を見ている。基本的には、自分のウェブサイトにとって最良の方法はどちらの方向性がないのでしょうか。どんなヒントや助けも大歓迎です。そして私はこの話題に関する知識が不足していることをお詫びしますが、これは私の頭の上にあると思っています... @ _ @

ここは私のウェブサイトです。それは私の個人的なアートワークのコレクションです： http://themptyrm.com

Answer 1

無限スクロール、私はここに私のプロジェクトでは、一度試してみた私は、これまで使用していた参照の一部です。..

https://github.com/paulirish/infinite-scroll

http://www.jquery4u.com/tutorials/jquery-infinite-scrolling-demos/

jScrollは、Philip Klauzinskiが作成した無限スクロール用のjQueryプラグインです。無限スクロール;レイジーローディング、エンドレススクロール、オートページャー、エンドレスページなどとも呼ばれます。下にスクロールすると、現在のページまたはコンテンツエリア内でAJAX経由でコンテンツを読み込むことができます。新しいコンテンツは、既存のコンテンツの最後までスクロールするたびに自動的に読み込まれることも、既存のコンテンツの最後にあるナビゲーションリンクをクリックしてロードすることもできます。

http://jscroll.com/

はそれがお役に立てば幸いです。

Answer 2

あなたはより多くを持っている場合、あなたのページが

素晴らしく見える方法で無限スクロールオプションに

<script type="text/javascript"> 
var $container = $('#container'); 
$container.infinitescroll({ 
    navSelector : '#page-nav', // selector for the paged navigation 
    nextSelector : '#page-nav a', // selector for the NEXT link (to page 2) 
    itemSelector : '.box',  // selector for all items you'll retrieve 
    loading: { 
     finishedMsg: 'No more pages to load.', 
     img: 'http://i.imgur.com/6RMhx.gif' 
    } 
    }, 
    // trigger Masonry as a callback 
    function(newElements) { 
    var $newElems = $(newElements); 
    $container.masonry('appended', $newElems); 
    } 
); 
</script> 

を指定することができ、あなたのhtmlファイルに

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
<script src="../jquery.masonry.min.js"></script> 
<script src="../js/jquery.infinitescroll.min.js"></script> 

これを追加し、ここで、これを追加疑問はここに行くMasonry with Infinite scroll