Fluidbox

JavaScript

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

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

[ads_center]

Fluidboxの使い方

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

Fluidboxの使い方

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

Fluidboxの使い方

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

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

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

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

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

Fluidbox

関連記事

  1. SVG 3D Tag Cloud jQuery Plugin
  2. JavaScript

    カスタマイズ性に優れたタグ入力ができるJSライブラリ・insignia

    insigniaはカスタマイズ性に優れたタグ入力を実装することができる…

  3. Hero slider

    JavaScript

    レスポンシブで横幅フルサイズのスライダーを実装できる「Hero slider」

    Hero sliderはレスポンシブに対応した横幅フルサイズのスライダ…

  4. JavaScript

    シンプルで軽量のレスポンシブなjQueryスライダー「ResponsiveSlides.js」を使っ…

    とてもシンプルで使いやすそうなレスポンシブのjQueryスライダー「R…

  5. pull-to-reload

    JavaScript

    下へ引いてページをリフレッシュ(リロード)できる「pull-to-reload」

    pull-to-reloadは、Webページ内で下へ引くだけでページを…

最近の記事

  1. Happy Plugs AIR1
  2. cheero Stream 10000mAh
  3. BOSE HOME SPEAKER 300
  4. RP-PC112
  5. SRS-XB402M

アーカイブ

PAGE TOP