slideBox.jsはレスポンシブに対応したLightboxスタイルのギャラリーやカルーセルを実装できるjQueryプラグインです。アイテムをグループ化させたりカルーセルページャーをサポートしたりと、機能性もバッチリです。
slideBox.js
以下、slideBox.jsの実際のデモになります。
デモにはImage Grid with Zoom、Carousel、Lazy Loadingの3つのサンプルが用意されています。
Image Grid with Zoomではサムネイル画像がグリッドレイアウトで並べられていて、任意のアイテムをクリックするとLightboxスタイルで拡大された画像が表示されます。
拡大時は画面の右側もしくは左側にカーソルを持っていくと矢印に切り替わります。右矢印（右側）の状態でクリックすると次の画像へ、左矢印（左側）の状態でクリックすると前の画像へ切り替えることが可能です。
また、画面中央付近ではカーソルがマイナスがついた虫眼鏡になるので、この状態で画像をクリックすると元のサムネイルリストに戻ります。ちなみに、右上にあるバツ印からでもサムネイルリストに戻ることが可能です。
マークアップも画像タグを並べたり前後ページ・クローズボタンを記述したりするだけなのでとても簡単に実装できると思います。具体的なコードの例は冒頭で紹介したデモページに記載されているので、気になる人はぜひチェックしてみてください。
また、slideBox.jsのダウンロードは、以下のページになります。
