skuare.net

画像ギャラリーは数あれど、ここまで高機能なライブラリはなかったのではないでしょうか。
jQueryプラグインのDiapoは多くのエフェクトやスマートフォン対応、円型メーター、ナビゲーション、ページネーション、サムネイル表示などの機能や各種設定を細かくできます。
困った時はまずこのプラグインを検討してみるのもいいかもしれません。

使用方法 Diapoからファイル一式をダウンロード。
<link rel="stylesheet" href="diapo.css" type="text/css">
<script type="text/javascript" src="jquery-1.6.1.min.js"></script>
<script type="text/javascript" src="jquery.hoverIntent.js"></script>
<script type="text/javascript" src="jquery.easing1.3.js"></script>
<script type="text/javascript" src="diapo.js"></script>
<script type="text/javascript">
$(function() {
$('.pix_diapo').diapo({
fx:'mosaicRandom' //エフェクト
});
});
</script>
※diapo.css内で画像の幅を調整してください。
<div class="pix_diapo">
<div data-thumb="サムネイル画像パス1">
<amp-img src="画像パス1">
<div class="caption elemHover fromLeft">キャプション1</div>
</div>
<div data-thumb="サムネイル画像パス2">
<amp-img src="画像パス2">
<div class="caption elemHover fromLeft">キャプショ2ン</div>
</div>
</div>

※fromLeftで左から出てきます。
これで完成ですが、数々の設定はサンプルページの最下部あるいは元サイトに。

思わず"いいね！"したくなる高機能画像ギャラリーJavaScript「Diapo」サンプル