jQueryプラグインcolorbox.jsを使って、多機能なスライドギャラリー効果。

この例では、5つの画像へのリンクを<li>タグで作成していますが、クラス名で指定するだけで、いろいろな効果を付けることができます。同じ画像へのリンクを複製し、クラス名のみ替えて、使い回すことも容易です。
下の画像リンクをクリックすると、スライドギャラリー効果が開始されます。画像をクリックすると、次に移ります。途中で停止する場合は、画像の外側をクリックします。その他、「X」ボタンや、「Stop Slideshow」でも停止します。

基本の効果

75%縮小(特殊な効果はなし)

スライドショー



※引用、参考:http://www.jacklmoore.com/colorbox