no-image

JavaScript

レスポンシブでスタイリッシュな「lightbox-jquery-plugin」

lightbox-jquery-pluginは、レスポンシブに対応したスタイリッシュなLightboxを実装できるjQueryプラグインです。滑らかなアニメーションとシンプルな操作性がとてもいい感じです。

lightbox-jquery-plugin

デモ

デモでは全部で5つのサムネイル画像が並べられており、各画像をクリックするとその画像が拡大表示されます。アニメーションはズームイン・ズームアウトとフェードを組み合わせたような感じで、とてもスマートな印象です。

拡大時には左右に前後移動する矢印やナビゲーションなども特になく、右上にクローズボタンがあるだけというシンプルさが特徴です。

気になる画像を1枚ずつ選んでじっくり鑑賞したいという時には最適なプラグインですね。

拡大時の背景にはオーバーレイもかかるので、画像により集中しやすくなります。また、レスポンシブにも対応していることから、ブラウザ幅に合わせて調整されるのも便利です。

というわけで、レスポンシブに対応したシンプルでスタイリッシュなLightboxを実装したい人は、ぜひ「lightbox-jquery-plugin」をチェックしてみてはいかがでしょうか?

lightbox-jquery-plugin

BeefUp多彩なカスタマイズができるjQueryアコーディオンプラグイン「BeefUp」前のページ

円形に広がるメニュー実装「expanding action button」次のページno-image

関連記事

  1. plainModal

    JavaScript

    カスタマイズ性が高いシンプルなモーダルウィンドウのjQueryプラグイン「plainModal」

    plainModalはシンプルでカスタマイズ性が高いモーダルウィンドウ…

  2. Animated Heat Distortion Effects with WebGL

    JavaScript

    陽炎のような揺れを表現できる「Animated Heat Distortion Effects wi…

    夏の暑い日などによく見かける「陽炎」のようなエフェクトを実装することが…

  3. Priority Nav Scroller

    JavaScript

    水平スクロールができるナビゲーション「Priority Nav Scroller」

    Priority Nav Scrollerは水平スクロールを備えたナビ…

  4. Fly to

    JavaScript

    カートに入れた際に飛んでいくエフェクトのjQueryプラグイン「Fly to」

    Fly toは商品をカートに入れた際にカートまで飛んでいくエフェクトを…

  5. iconate.js

    JavaScript

    アイコンをオシャレにアニメーションしながらtransformさせる「iconate.js」

    iconate.jsはアイコンをアニメーションさせながら別のアイコンへ…

  6. Section Scroller

    JavaScript

    セクションごとに自動でスクロールしてくれるボタン実装「Section Scroller」

    Section Scrollerは、セクションごとにスムーズにスクロー…

最近の記事

  1. Apple WatchでのMacロック解除を無効
  2. オータムスイートポテトフラペチーノ
  3. 紅葉
  4. ナノケア EH-NA0E
  5. スターバックス コロンビア サンタンデール

アーカイブ

PAGE TOP