Smooth Galleryとは?

Smooth GalleryはAjax(非同期通信処理)を利用して画像をスライドショーのように表示するライブラリです。画像は単独ではなく複数の画像を用意する必要があります。また、手動でスライド処理を行うようにするか、自動的にスライド表示するか、どのくらいの秒数で切り替えるかなど細かい指定も行うことができます。Smooth Galleryは、画像だけでなく画像がクリックされた時の表示先ページや、タイトル、キャプションなどを決められたタグで囲みます。他のスライド表示ライブラリと比べると若干煩雑な部分があります。

また、Smooth Galleryは単独で動作するのではなくAjaxライブラリの1つであるMooToolsを必要とする点にも注意が必要です(*1)。他のライブラリを使用している場合や、ライブラリに依存したくない場合には他のスライド表示ライブラリを使用するのがいいでしょう。

Smooth GalleryはこのURLにあるページからダウンロードすることができます(*1)。

Smooth Gallery

「Download」のタブをクリックするとダウンロードページに移動します。「Download JonDesign's Smooth Gallery 1.0.1 in Zip Format」と書かれた文字をクリックするとダウンロードが行われます。

「Download」のタブをクリック

ダウンロードされたファイルはZIP形式になっているので解凍します。解凍すると以下のファイル構成になります。

解凍後の展開図

ここで必要になるファイルはcssフォルダ、scriptsフォルダ内の全てのファイル/フォルダです(*3)。Smooth Galleryは、この2つのフォルダ構成のまま利用するようにします。

*1MooToolsは以下のサイトで詳細を見ることができます。
http://mootools.net/
*2ここではSmooth Galleryのバージョン1.0.1で説明しています。
*3scriptsフォルダ内のmootools.uncompressed.jsファイルはライブラリの非圧縮ファイルです。ここで説明するサンプルでは圧縮されたファイルを使用しているのでmootools.uncompressed.jsファイルは削除しても問題ありません。