Fluidbox

JavaScript

シンプルで軽快な動作が素敵なLightbox風のjQueryプラグイン「Fluidbox」

FluidboxというjQueryプラグインを使えば、シンプルで軽快な動作が素敵なLightboxのような機能を実装することができます。この手のプラグインは色々ありますが個人的にはとても気に入りました。実際のデモはレスポンシブになっていて、画面の横幅に合わせた画像サイズに最適化されます。

[ads_center]

Fluidboxの使い方

このように見たいサムネイル画像をクリックすると。

Fluidboxの使い方

こんな感じで拡大されます。クイッとした軽快な動作です。素早く画像を確認できる点がいいですね。

Fluidboxの使い方

使い方もとてもシンプルです。

$(function () {
    $("a").fluidbox();
});

マークアップはこんな感じで。

<a href="...">
    <img src="..." alt="" />
</a>

ブログなんかにも取り入れたくなってきちゃいますね。

Fluidbox

WordPressでパンくずリストを設置WordPressでパンくずリストをプラグインなしで設置する簡単なやり方前のページ

jQueryを使わないでコードを書くTips集次のページjQueryを使わないコード集

関連記事

  1. 3D Cube CountDown script
  2. no-image
  3. RefineSlide

    JavaScript

    多数のエフェクトが素敵!レスポンシブ対応のjQueryスライダー「RefineSlide」

    多数のエフェクトがあってレスポンシブWebデザインにも対応しているスラ…

  4. Multipicker

    JavaScript

    要素を選択するときに直感的な操作を実現する「Multipicker」

    Multipickerは、日付や曜日、番号、その他さまざまな要素を選択…

  5. jQuery Scrollify

    JavaScript

    セクションごとにスクロールしてくれる「jQuery Scrollify」

    jQuery Scrollifyはセクションごとにスクロールしてくれる…

  6. FitVids.JS

    JavaScript

    YouTubeやVimeoからの埋め込み動画をレスポンシブにするjQueryプラグイン「FitVid…

    YouTubeやVimeoからの埋め込み動画をレスポンシブに対応させる…

最近の記事

  1. 田沢湖
  2. ゴムの耳栓
  3. ライオンコーヒー(バニラマカダミア)
PAGE TOP