no-image

JavaScript

レスポンシブ対応のjQuery Lightbox & Popupプラグイン「Flashy」

Flashyはレスポンシブに対応したjQuery Lightbox & Popupプラグインです。画像はもちろん、インラインコンテンツ、iframe、vimeo、ユーチューブにも対応しています。キーボードもサポートしているので操作性も良好です。

Flashy

Flashy

デモでは画面中央に複数のサムネイル画像が並べられています。これをクリックすると拡大された画像が表示される仕組みです。拡大時の画面では両端に前後移動できる矢印アイコンが設置されていて、ここから前後の画像に切り替えることができます。

また、キーボードもサポートしているのでキーボードの左右の矢印キーからでも前後移動が可能です。

左上からは画像の総数と現在の何番目の画像が開かれているかが確認できます。元に戻る場合は右上のバツ印をクリックするか、escキーからでも戻ることが可能です。

サムネイル画像の下にはカスタムタイプのデモも用意されています。Vimeo、YouTube、iFrame、Inlineというボタンがあり、各ボタンをクリックするとそのタイプのデモをチェックできます。

多彩なコンテンツをLightboxで表示させたい人は、ぜひ「Flashy」を活用されてみてはいかがでしょうか? ライセンスはMITになります。

no-imageシンプルで軽量なスクロールアニメーション実装「animateMePlz」前のページ

高速・軽量なコンテキストメニュー実装「hummingbird-popover」次のページhummingbird-popover

関連記事

  1. Pongstagr.am

    JavaScript

    自分のインスタグラムの画像を表示できるjQueryプラグイン「Pongstagr.am」

    Pongstagr.amは自分のインスタグラムの画像をWebサイトに表…

  2. Nivo Zoom

    JavaScript

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

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

  3. no-image

    JavaScript

    指定したテキストをハイライトとタイピング効果で表示できる「typeLighter.js」

    typeLighter.jsは、指定したテキストをハイライトとタイピン…

  4. gridslide.js

    JavaScript

    いろんな方向に画像をスライドできるjQueryイメージスライダー「gridslide.js」

    gridslide.jsはいろんな方向に画像をスライドさせることができ…

  5. JavaScript

    リストなど複数の要素をランダムにフェードで表示していくjQueryプラグイン「champagne.j…

    どこかで使う機会がありそうな感じのjQueryプラグイン「champa…

最近の記事

  1. 200-DGBG020
  2. Anker PowerPort 5-in-1 37.5W Hub
  3. α7C + FE28-60mm F4-5.6

アーカイブ

PAGE TOP