imagelightbox

JavaScript

レスポンシブ対応でタッチフレンドリーな画像ギャラリー「imagelightbox」

imagelightboxは、レスポンシブに対応したタッチフレンドリーな画像ギャラリーを実装することができるjQueryプラグインです。シンプルなデザインながらもオプションが豊富なので、多彩なカスタマイズが可能です。

imagelightbox

デモ

デモページにはさまざまなタイプのサンプルが用意されています。サムネイル画像をクリックすると、拡大画像が表示されます。画像をクリックしたり左右の矢印キーを操作したりすると、次の画像に切り替えることが可能です。

アニメーション付きで画像が切り替わるのがとても素敵ですね。フェードイン/フェードアウトによるアニメーションで、美しくエレガントに切り替わっていきます。

オーバーレイと共に表示されるもの、クローズボタン付き、キャプション付き、ナビゲーション付き、画面両端に左右矢印が表示されるもの、などなどいろんなタイプのデモを見ることができます。

また、imagelightboxはタッチフレンドリーになっているところもポイントです。実際にiPhoneでデモに触れてみたところ、しっかり動作を確認できました。拡大画像の表示や画像の切り替えなど、パソコンだけではなくスマホでも快適に操作できるのは助かりますね。

便利なオプションもたくさん用意されているので、好みに合わせたカスタマイズも可能です。矢印、ボタン、キャプション、キーボード、ナビゲーション、オーバーレイなどの有効・無効を指定できたりアニメーションスピードの数値を設定できたり、さまざまなカスタマイズが可能です。

imagelightbox

関連記事

  1. Vimeo Carousel Gallery
  2. Tip

    JavaScript

    シンプルなUIで使いやすいツールチップ実装「Tip」

    TipはシンプルなUIによる使いやすいツールチップを実装することができ…

  3. SweetModal

    JavaScript

    シンプルでエレガントなモーダルウィンドウを実装できる「SweetModal」

    SweetModalは、アラートやダイアログなどをシンプルでエレガント…

  4. jQueryプラグインのスライダー集

    JavaScript

    【jQueryプラグイン】素晴らしい機能が満載のスライダー集

    jQueryプラグインには様々な役立つ機能がありますが、中でも人気が高…

  5. no-image

    JavaScript

    スライダータイプの質問フォーム実装「jquery.formslider」

    jquery.formsliderはスライダータイプによる質問フォーム…

  6. JavaScript

    画面全体に背景を表示させフェードやスライドもできるjQuery「bgStretcher」

    ブラウザの画面全体に背景を表示させることができるjQueryプラグイン…

最近の記事

  1. COMOLIの製品染ナイロン アノラックとトラックパンツ
  2. WH-XB900N
  3. Eufy RoboVac L70 Hybrid
  4. cheero Smart USB Charger 48W CHE-320

アーカイブ

PAGE TOP