PhotoSwipe

JavaScript

タッチジェスチャーにも対応したイメージギャラリー・PhotoSwipe

PhotoSwipeはスマホやタブレットのタッチジェスチャーにも対応しているJavaScriptイメージギャラリーです。画像をズームしたりピンチインでクローズしたりと何かと使い勝手の良いUIを実装することができます。

[ads_center]

PhotoSwipe

デモやダウンロード、または使い方の詳細に関しては以下のサイトから確認することができます。

PhotoSwipe

PhotoSwipey

実際にiPhoneからアクセスしてみたところ、このようにレイアウトも最適化され動作もとてもスムーズでした。かなりいい感じのギャラリーです。

iPhoneからアクセス

デモではAll controlsとMinimalの2タイプから選ぶことができるようになっています。All controlsではキャプションやシェア、それにフルスクリーン機能もついています。Minimalにはキャプションなどの機能はついていません。

タッチジェスチャーの使い方では、主に下記の4つの機能を利用できるようになっています。

  • ピンチアウトで画像をズーム
  • ピンチインで画像をクローズ
  • 上下の垂直方向へのスワイプで画像をクローズ
  • 左右の水平方向へのスワイプで画像切り替え

機能的にスマホでここまでできるなら充分といったところではないでしょうか。

そんなわけで、色々と高性能なイメージギャラリーを実装することができるPhotoSwipeのご紹介でした。

関連記事

  1. Jquery Tab Plugin

    JavaScript

    シンプルで見やすいタブパネルを実装できる「Jquery Tab Plugin」

    Jquery Tab Pluginはシンプルで見やすく、そして操作しや…

  2. ToxicBox

    JavaScript

    さまざまなコンテンツをポップアップウィンドウで表示できる「ToxicBox」

    ToxicBoxは、ライトボックスのjQueryプラグインです。近年、…

  3. no-image

    JavaScript

    立体的なナビゲーションメニューを実装できる「Sidebar Menu Concept」

    Sidebar Menu Conceptは立体的なナビゲーションメニュ…

  4. JavaScript

    レスポンシブ対応で優雅なエフェクトが印象的なjQueryスライダー「Juicy Slider」

    レスポンシブに対応している軽量のjQueryスライダー「Juicy S…

  5. JavaScript

    高さや幅が不揃いの要素をキレイに揃えてくれるjQueryプラグイン「equalize.js」

    高さや幅が不揃いの要素をキレイに揃えてくれるjQueryプラグイン「e…

  6. mmenu

    JavaScript

    スマホアプリのように横からスライドするメニューのjQueryプラグイン「mmenu」

    mmenuというjQueryプラグインを使えば、スマホアプリのように横…

最近の記事

  1. ワンタッチ着脱フィルターキット
  2. Soundcore Ace A1
  3. cheero USB-C PD Charger 60W
  4. DY-S01

アーカイブ

PAGE TOP