Blog

Infinite Scrollを実装してみました

2012.02.15Cat:jQuery プログラマー

Infinite Scrollとは、
ページャーの代わりに、ページ内で次のページのレコードを読む出すライブラリのことです。
http://www.infinite-scroll.com/

WordPressのプラグインもあって、jQueryのプラグインもあります。

下記のサイトで体験できます。
http://kachibito.net/sample/jquery-masonry/

今回実装したのは、jQueryのプラグインです。

1、ライブラリをダウンロード
https://github.com/paulirish/infinite-scroll

2、htmlソース

3、一旦停止・再開
htmlソースをブラウザが読み込んだら、Infinite Scrollが自動的に初期化(bind)します。
そのあと、navSelectorをスクロールが通ったら、自動的に次ページのデータを読み込みます。

それを一旦停止したい場合は、下記ソースを書きます。

また、再開する場合は、こう書きます。

4、自動的にページングではなく、クリックしてからページングにするには?

また案件進行中ですので、実装したURLは非公開にさせていただきます。

 

Author Profile

jeff_maj

システムエンジニア/1984年生/上海交通大学卒/Webサービス/EC/iphone/android

» 投稿一覧
  • Launch Cart次世代ECサイト構築システム 初期月額無料
  • LaunchMovie ECに特化した動画制作サービス

Archive

ページTOPへ