NO IMAGE

JavaScript

テキストコンテンツをページ分割(ページネーション)できる「jPaginate」

jPaginateはWebページ内のテキストコンテンツをページ分割(ページネーション)することができるjQueryプラグインです。長文記事などで下へずっとスクロールしながら読んでいると、今どの場所を読んでいたか分からなくなってしまう時がありますが、ページ分割されていれば、こういう問題も少なくなりそうですね。

jPaginate

jPaginate

サンプルページでは、2つのデモが用意されています。長い文章を分割して表示させているので、下へずっとスクロールしていく必要がなく、その場でサクサクと読み進めていくことができます。

ページナンバー、または左右の矢印ボタンをクリックすることで、ページを移動できます。

長いテキストを分割させることで、Webページのレイアウトもスッキリするので、省スペースながらもたくさん情報を詰め込みたい時に便利ですね。

また、jPaginateにはオプションもいくつか用意されています。主なオプション項目は、pagination_class、items_per_page、prev_next、prev_text、next_textです。

ページを分割する数はitems_per_pageで指定することができます。また、前後移動するボタンは、prev_textとnext_textから指定できます。デフォルトでは、prev_textが「«」、next_textが「»」です。

マークアップ、使い方ともに簡単に実装できるので、テキストコンテンツにページ分割機能を実装したいという人は、ぜひ「jPaginate」をチェックしてみてはいかがでしょうか?

関連記事

  1. syncscroll

    JavaScript

    2つ以上のスクロールエリアを同時にスクロールできる「syncscroll」

    syncscrollは2つ以上のスクロールエリアを同時にスクロールでき…

  2. JQuery Portfolio
  3. PleaseWait

    JavaScript

    ローディングアイコンをオシャレに実装することができる「PleaseWait」

    PleaseWaitはローディングアイコンをオシャレに見せることができ…

  4. Shine

    JavaScript

    ダイナミック(動的)で美しいシャドウを実装できるJSライブラリ「Shine」

    ShineというJavaScriptライブラリが素敵だったのでメモがて…

  5. Hover Carousel

    JavaScript

    超軽量なホバーカルーセルを実装できる「Hover Carousel」

    Hover Carouselは超軽量なホバーで動作するカルーセルを実装…

  6. TypeIt

    JavaScript

    タイピングアニメーションを実装できる「TypeIt」

    TypeItはタイピングアニメーションを実装できるjQueryプラグイ…

最近の記事

  1. ルック セレクション
  2. シルキーウインドモバイル
  3. アリエール パワージェルボール3D
  4. NuAns × Shibaful TAGPLATE

アーカイブ

PAGE TOP