寺子屋未満

HTML画面上にスクリーンを表示するスクリプトです。
今回は複数の画像を準備して、自動スライドショーを実行させます。

[splash.image.js]
http://xuxu.fr/ressources/javascript/splash.image/

◆スライドショーを表示する方法
基本的にはスクリーン表示の場合と同じように設定を行います。
リンクタイプ[rel="xxx"]を指定する際、
splash.imageと一緒にグループ名を指定することにより、
スライドショーを行うグループであると認識されます。
<a href="[画像URL]" title="TITLE" rel="splash.image|[グループ名]">
    <img src="[サムネイルURL]" />
</a>
<a href="[画像URL]" title="TITLE" rel="splash.image|[グループ名]">
    <img src="[サムネイルURL]" />
</a>
<a href="[画像URL]" title="TITLE" rel="splash.image|[グループ名]">
    <img src="[サムネイルURL]" />
</a>
<a href="[画像URL]" title="TITLE" rel="splash.image|[グループ名]">
    <img src="[サムネイルURL]" />
</a>
<a href="[画像URL]" title="TITLE" rel="splash.image|[グループ名]">
    <img src="[サムネイルURL]" />
</a>

グループの指定方法は[splash.image|（グループ名）]です。
これで同じグループ名をつけたどの画像をクリックしてもスライドショーが始まります。

サンプル Step2

夏も近いので、テーマは水。（Photo By Zorg）

今回はサンプルHTMLを作成するのにかなり時間を使ってしまいました。
次回、一つのページで複数のスライドショーを表示してみたいと思います。