Ion Zoom

JavaScript

シンプルで美しいLightbox系のjQueryプラグイン「Ion Zoom」

シンプルで美しいLightbox系のjQueryプラグイン「Ion Zoom」をご紹介します。サムネイル画像をクリックするとその場で画像が拡大します。この手のプラグインは色々あるのでこちらも候補の一つとして覚えておきたいですね。iPhoneでも確認してみたところちゃんと動作しました。ということで以下、使い方です。

[ads_center]

使い方

Ion Zoom

このように見たい画像を拡大することができます。

使い方はとても簡単です。独立したギャラリーを実装する場合は以下のようにマークアップします。

<a href="画像パス1" class="gallery_1"><img src="画像パス1" alt="" /></a>
<a href="画像パス2" class="gallery_1"><img src="画像パス2" alt="" /></a>
<a href="画像パス3" class="gallery_1"><img src="画像パス3" alt="" /></a>
・・・略・・・

jQueryとプラグインを読み込んだ状態でギャラリーを初期化します。

$(".gallery_1").ionZoom();

コントロールを無効にする場合はvisibleControlsをfalseに指定します。

$(".gallery_1").ionZoom({
    visibleControls: false
});

jQuery 1.9+、ブラウザはChrome、Firefox、Opera、Safari、IE(8.0+)になります。また、iPhoneやiPadなどのタッチスクリーンデバイスでも動作します。

ライセンスはMITライセンスとのこと。ダウンロードや詳細は以下からどうぞ。

関連記事

  1. NavSync

    JavaScript

    ナビゲーションとコンテンツが連動するjQueryプラグイン「NavSync」

    NavSyncはナビゲーションとコンテンツが連動してアニメーションする…

  2. VenoBox

    JavaScript

    画像・Google マップ・YouTubeなどを埋め込めるLightbox風jQueryプラグイン「…

    VenoBoxは色んなコンテンツを埋め込めるLightbox風jQue…

  3. vTicker

    JavaScript

    シンプルで使い方も簡単!垂直ティッカーを実装できるjQueryプラグイン「vTicker」

    シンプルで使い方も簡単な垂直ティッカーを実装できるjQueryプラグイ…

  4. jQuery Flip-Quote
  5. makefixed.js

    JavaScript

    スクロール中に要素を固定配置できるjQueryプラグイン「makefixed.js」

    makefixed.jsはスクロール中に指定した要素を固定配置させるこ…

  6. Simple Lightbox

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

最近の記事

  1. 梅しば
  2. BM-IBCDH13RD
  3. 雪
  4. ホットのドリップ
  5. めんたいこ&チーズ味 海老せんべい

アーカイブ

PAGE TOP