no-image

JavaScript

ミニマルでダイナミックなLightboxプラグイン「darkbox.js」

darkbox.jsはミニマルながらもダイナミックなLightbox風のイメージギャラリーを実装することができるjQueryプラグインです。レスポンシブ対応で矢印キーでの操作にも対応しています。ファイル容量も軽量なので、サクサク動作するのがいいですね。

darkbox.js

darkbox.js

デモでは画面中央に画像が表示されていて、これをクリックするとフルスクリーンによるギャラリーが起動します。画面いっぱいに広がったダイナミックな画像は、とても見応えがあります。

また、画面両端にはコンテンツを移動できる矢印アイコンが設置されているので、ここから画像を切り替えて見ていくことが可能です。ちなみに、キーボードの矢印キーでの操作にも対応しています。画面の上部にプログレスバーが表示されるのも便利ですね。

元に戻す場合は、画面の右上に表示されているバツ印をクリックすればOKです。

使い方もかなりシンプルなので、手軽に実装できます。オプションには、startWithCurrent、wrapAround、showProgressBar、showTitle、disablePageScrolling、endCallbackという項目が用意されています。

また、ライセンスはMITとのこと。ミニマルながらもダイナミックなLightboxプラグインを探している人は、ぜひ「darkbox.js」をチェックしてみてください。

no-image手軽にパララックス効果を実装できるシンプル・軽量な「simpleParallax」前のページ

ローディングアニメーションを手軽に実装できる「EasyLoading」次のページEasyLoading

関連記事

  1. Schedule Template

    JavaScript

    シンプルなスケジュール表を実装する「Schedule Template」

    スッキリしたデザインのシンプルなスケジュールテンプレートを実装するため…

  2. fullPage.js

    JavaScript

    フルページでコンテンツごとにスクロールする「fullPage.js」

    fullPage.jsはフルページでコンテンツごとにスクロールするレス…

  3. JavaScript

    軽量で嬉しい!画像を拡大ズームしてくれるjQueryプラグイン「Leroy Zoom」

    Leroy ZoomというjQueryプラグインを使えば、画像を拡大ズ…

  4. star-rating-svg

    JavaScript

    カスタマイズ性に優れたレーティング(星評価)実装「star-rating-svg」

    star-rating-svgは、SVGを使用したカスタマイズ性に優れ…

  5. jQuery fatNav

    JavaScript

    ミニマルテイストなフルスクリーンメニューを実装できる「jQuery fatNav」

    jQuery fatNavはミニマルテイストなフルスクリーンのナビゲー…

最近の記事

  1. 桜と太陽
  2. ベルボン Mシリーズ
  3. ネック冷却ファン NRF10
  4. Kindle 8GBモデル
  5. プロテクティングクロス PC-E2

アーカイブ

PAGE TOP