私は、jQuery MasonryおよびInfinite Scrollプラグインを使用して、API を使用して instagram から "n" 量の写真をロードするプロジェクトに取り組んでいます。この短い例を見ると、レンダリングする html ページを事前に用意しておく必要があることがわかります。
<nav id="page-nav">
<a href="pages/2.html"></a>
</nav>
問題は、何枚の写真が取得されるか本当にわからないことです。たとえば、一度に20枚の写真を取得する方法を次に示します。
$(document).ready(function(){
var access_token = location.hash.split('=')[1];
if (location.hash) {
$.ajax({
type: "GET",
dataType: "jsonp",
cache: false,
url: "https://api.instagram.com/v1/users/MY_USER_ID/media/recent/?access_token=MY_ACCESS_TOKEN",
success: function(data) {
for (var i = 0; i < 20; i++) {
$("#instafeed").append("<div class='instaframe'><a target='_blank' href='" + data.data[i].link +"'><img src='" + data.data[i].images.standard_resolution.url +"' /></a></div>");
}
}
});
} else {
location.href="https://instagram.com/oauth/authorize/?display=touch&client_id=MY_CLIENT_ID&redirect_uri=MY_URI";
}
});
ページネーション メカニズムが必要になると思いますが、上記のチュートリアルに基づいて、ロードする html ページを事前に定義する必要があると思います。だから今ここに私の質問
- それは、このプラグイン ( Infinite Scroll ) が無限スクロールを実現するために、ディレクトリに「n」個の html ファイルが必要であることを意味しますか?
- ページ数がわからない場合、同じプラグインで無限スクロールを実装することは可能ですか? 物理的な html ファイルを作成する必要さえなくても、さらに良いことはありますか?
- この種のページネーションはどのように実装できますか? (つまり、ユーザーが下にスクロールし続ける限り、20 枚の写真のチャンクをロードします) オンラインのドキュメントはそれほど多くありません。デモや説明の簡単な手順を教えていただけますか?
敬具