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. jQuery Gridly

    JavaScript

    クリックしてその場で拡大したりドラッグで配置を入れ替えたりできるプラグイン「jQuery Gridl…

    おもしろいjQueryプラグインがあったのでご紹介します。クリックして…

  2. no-image

    JavaScript

    ミニマルなイメージギャラリーを実装できる「Albery」

    Alberyはミニマルなイメージギャラリーを実装できるjQueryプラ…

  3. timedropper

    JavaScript

    時刻を指定しやすくしてくれるjQueryのタイムピッカー「timedropper」

    timedropperは時刻の指定をしやすいUIを実装できるjQuer…

  4. EZ Plus

    JavaScript

    タッチにも対応した画像ズーム機能を実装できるjQueryプラグイン「EZ Plus」

    EZ Plusはタッチにも対応した画像ズーム機能を実装することができる…

  5. marginotes

    JavaScript

    テキストの余白に注釈をつけて読みやすい記事をつくれる「marginotes」

    marginotesは、クールなマージンノートを作成するjQueryプ…

  6. jQueryでウィンドウサイズによって処理を変える

    JavaScript

    jQueryでアニメーションを遅らせるにはdelayを使えばいいらしい

    ちょっとしたメモです。jQueryでanimateをメソッドチェーンで…

コメント

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

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

最近の記事

  1. Olli
  2. 単語帳メーカー(Flashcard Maker App)
  3. 1Password 7
  4. 風に揺れる草

Facebookページ

PAGE TOP