最近はレスポンシブの風が押し寄せて来て、プラグインもレスポンシブ対応のモノを使うしかなくなって来た。
超定番プラグインlightboxも色々と出されているけど、各種端末対応するなら「Swipebox」がものスゴくおすすめ!
その名の通り、グループ化したイメージをスワイプで遷移させることができる!
やはりタッチデバイスではスワイプでしょっ!(笑)
ちなみにPCではカーソルでも動くので、至れり尽くせりといった感じで非常に重宝です♪
実装は簡単で、ダウンロードしたjquery.swipebox.jsとswipebox.cssを、jQuery共々リンクし、下記の感じでjsを書く。
jQuery(function($) { $(".swipebox").swipebox({ useCSS : true, hideBarsDelay : 3000, //バーが非表示になる時間 }); });
そして画像リンクに、
<a href="#" class="swipebox" rel="gallery-1"><img src="#"></a>
と言う感じで書き加える。ちなみに「rel=”gallery-1″」はグループ化の場合。
するとこんな感じで動きます。
いつも思いますけど、こういう素晴らしいものを作ってくださる方々に感謝感謝です!
ちなみに「Nivo Lightbox」というレスポンシブ対応のlightboxがありますが、なぜかiOSでは動きませんでした・・・惜しい〜 (-_-)
[…] http://www.nicefeeling.jp/blog/works/1608.html […]