Rebox

JavaScript

レスポンシブ対応の軽量なLightbox風jQueryプラグイン「Rebox」

ReboxというjQueryプラグインを使えば、レスポンシブに対応した軽量のLightbox風の機能を実装することができます。jQueryの他にZeptoにも対応しているとのこと。実際のデモはとてもシンプルなデザインで、モバイルフレンドリーになっているところがいいですね。

[ads_center]

Reboxの使い方

Rebox

Rebox

使い方もすごくシンプルですね。以下は画像単体での場合です。画像を閉じる場合は画面右上にあるバツ印でクローズできます。

$('#sample a').rebox();

複数の画像をギャラリーとしてグループ化させたい場合には、オプションのselectorを設定する必要があります。

$('#sample').rebox({ selector: 'a' });

オプションは他にも、prev・nextの設定、 loading、speedなど色々と用意されています。

レスポンシブでPC以外にスマホやタブレットにも対応させたい場合に活用してみたいですね。どこか落ち着いた雰囲気やゆったりとした印象を受ける素敵なプラグインだと思います。

全体的に大人っぽい感じのデザインなので、そのようなLightboxを使いたい人にはピッタリです。

Vide背景にvideoを表示できるjQueryプラグイン「Vide」前のページ

シンプルでレスポンシブ対応のアコーディオンを実装できるjQueryプラグイン「jQuery Accordion」次のページjQuery Accordion

関連記事

  1. jQuery.fontFlex
  2. JavaScript

    指定した画像を遅らせてローディングさせるjQueryプラグイン「Lazy Karl」の使い方

    ちょっと面白そうだったので試してみました。画像を表示させるまでの間にロ…

  3. JavaScript

    中心から外側に広がっていくエフェクトのjQueryプラグイン「jQuery.twinkle」

    jQuery.twinkleというjQueryプラグインを使えば、中心…

  4. JavaScript

    レスポンシブでカスタマイズ性に優れたカルーセルを実装できるjQueryプラグイン「slick」

    slickというjQueryプラグインを使えば、レスポンシブでカスタマ…

  5. Nivo Zoom

    JavaScript

    Lightbox風に画像をズームして表示させるjQueryプラグイン「Nivo Zoom」

    Lightbox風に画像をズームして表示させるjQueryプラグイン「…

最近の記事

  1. Aモーニングセット
  2. 白トリュフの塩パンやメロンパンなど
  3. 東京都現代美術館
  4. スーリア バターチキン
  5. そそそ 明太クリームそうめん

アーカイブ

PAGE TOP