サムネイルをクリックすると画像を大きく表示したいのですが

質問

サムネイルをクリックすると、別ウィンドウで開くのではなく、バックがグレーになり選択した画像が大きく表示されるようにしたいのです。

http://tamashii.jp-network.co.jp/item/item.php?eid=01004&pref=500

上記の様に表示したいのですが、現状はCLOSE×の表示のみですが、これに画像が大きく表示された状態で次の画像へジャンプしたり、前の画像に戻ったりするようにすることはできるのでしょうか？

JAVAスクリプトでできるのかもわからないほどの初心者で申し訳ありませんが、何卒宜しくお願いします。

回答No.1

noname#78238 · ベストアンサー

Light Box 2でのやり方です。

<a href="image-1.jpg" rel="lightbox[xxx]">画像1</a>
<a href="image-2.jpg" rel="lightbox[xxx]">画像2</a>
<a href="image-3.jpg" rel="lightbox[xxx]">画像3</a>

上記のように、画像を開くときのaのrel属性を

rel="lightbox[xxx]"

と設定すれば、前の画像・次の画像への移動が出来るようになります。
xxxの部分はどんな文字が入っても大丈夫です。
また、xxxの部分が同じものはひとつのセットになります。

参考URL：

http://www.huddletogether.com/projects/lightbox2/

お礼

ありがとうございます！！
そうコレ！です！
助かりましたm(__)m