PhotoSwipe

JavaScript

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

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

[ads_center]

PhotoSwipe

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

PhotoSwipe

PhotoSwipey

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

iPhoneからアクセス

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

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

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

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

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

関連記事

  1. Shuffle Letters

    JavaScript

    テキストをカシャカシャとシャッフルさせて表示していくjQueryプラグイン「Shuffle Lett…

    テキストをカシャカシャとシャッフルさせて表示していくjQueryプラグ…

  2. Simple Easy Slider

    JavaScript

    美しいフェードスライダーを実装できるjQueryプラグイン「Simple Easy Slider」

    Simple Easy Sliderは美しいフェードアニメーションによ…

  3. jQuery TextFill

    JavaScript

    テキストをリサイズしてコンテナにフィットさせる「jQuery TextFill」

    jQuery TextFillはテキストをリサイズしてコンテナにフィッ…

  4. Circliful

    JavaScript

    円グラフで統計情報を伝えたい時に役立つjQueryプラグイン「Circliful」

    CirclifulというjQueryプラグインを使えば、統計情報を伝え…

  5. Bootstrap Photo Gallery jQuery plugin
  6. desoSlide

    JavaScript

    サムネイル付きのナビが素敵なスライダーを実装できるjQueryプラグイン「desoSlide」

    desoSlideというjQueryプラグインを使えば、サムネイル付き…

最近の記事

  1. EH-NA0B
  2. KPS-88
  3. Happy Plugs AIR1
  4. cheero Stream 10000mAh
  5. BOSE HOME SPEAKER 300

アーカイブ

PAGE TOP