WEBサイトや、ブログ等の記事をページング機能ではなく、facebookのタイムラインのように無限スクロールで実装するプラグイン「infinite scroll」。

wordpressなどのブログ記事や、ECサイト等、様々なシーン活躍出来そうですね。

今後使いそうな予感がするので、覚え書き。

1.まずは、プラグインの準備

JQUERY本体をJQUERYの公式サイトから、infinite scrollをinfinite scroll配布ページの、ページ右下の「Download ZIP」ボタンからダウンロード。

まずは、JqueryとJavascriptの読み込み。

2.設定方法

プラグインの設定部分を記述。まずはプラグインを適用したい要素をセレクターに指定する。

※jQueryプラグインは、適用したい要素に、.(ドット)繋ぎでプラグイン名を書き、丸括弧”()”とセミコロン”;”を書くことで実行される。

3.オプションの指定

最後にオプションを指定。基本的な機能は以下の3つを指定すれば利用可能。

• ★navSelector：次に読み込む要素を囲む要素を指定
• ★nextSelector：次に読むこむ要素自体を囲む要素を指定
• ★itemSelector：表示させたい要素を指定

その他のオプション。

• ★debug：console.logに出力するデバッグメッセージを有効／無効にします
• ★loadingImg：ローディング時に表示する画像のパスを指定します
• ★loadingText：ローディング画像に添えるテキストの指定をします
• ★animate：コンテンツのロード時にアニメーションさせるか指定します
• ★extraScrollPx：次のコンテンツを読み込むまでのスクロール量をピクセル指定します
• ★donetext：全てのコンテンツを表示し終わったら表示させるテキストを指定します
• ★errorCallback：404ページがコールされたときや、これ以上のコンテンツがない場合の処理を指定します

The road not taken（選ぶもののない道）

アメリカンポップアート展 〜「200個のキャンベル・スープ缶...