BookBlock Revised

JavaScript

ページめくりのエフェクトを実装できるjQueryプラグイン「BookBlock Revised」

BookBlock RevisedというjQueryプラグインを使えば本やカレンダーのようなページめくりのエフェクトを実装することができます。ペラっとした柔らかい紙の質感ではなくて、パタパタとめくっていく感じです。横にめくるのはもちろん、縦にもめくれる(実際のデモではカレンダーとして実装)のが面白いですね。

[ads_center]

BookBlock Revisedの使い方

BookBlock Revised

BookBlock Revised

こんな感じで、本を読んでいるかのようにめくっていくことができます。

マークアップもシンプルですね。

<div id="bb-bookblock" class="bb-bookblock">
    <div class="bb-item">
        <!-- コンテンツ -->
    </div>
    <div class="bb-item">
        <!-- コンテンツ -->
    </div>
    <!-- 中略 -->
</div>

プラグインの呼び出し。

$(function() {
    $('#bb-bookblock').bookblock();
});

ページめくりを実装したい時に覚えておきたいプラグインです。

関連記事

  1. textwriteout

    JavaScript

    テキストの書き出し・削減ができるjQueryプラグイン「textwriteout」

    textwriteoutは指定したテキストを書き出したり削減したりでき…

  2. chalk-animation

    JavaScript

    カラフルなアニメーションを実装できる「chalk-animation」

    chalk-animationはカラフルなアニメーションによるテキスト…

  3. JavaScript

    テーブルを綺麗なデザインにしてくれたり並び替え(ソート)もできるjQuery「tablesorter…

    jQueryのプラグインで、テーブルをフレキシブルなデザインにしてくれ…

  4. Letter Effects and Interaction Ideas
  5. no-image

    JavaScript

    多彩なエフェクトを備えたjQueryスライダープラグイン「camera-slider」

    camera-sliderは多彩なエフェクトを備えた美しいスライドショ…

  6. no-image

    JavaScript

    タッチフレンドリーでモバイルでも快適に動作する「simplelightbox」

    simplelightboxはレスポンシブ対応でタッチフレンドリーなl…

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

最近の記事

  1. EH-NA0B
  2. KPS-88
  3. Happy Plugs AIR1
  4. cheero Stream 10000mAh
  5. BOSE HOME SPEAKER 300

アーカイブ

PAGE TOP