Highslide JS
Highslide JS – JavaScript thumbnail viewer が格好いいです。なんとなく「Web2.0」という言葉と同じくらいにアリガチな「サムネイルをクリックすると画像拡大する」という JavaScript ですが、拡大の方法が面白い。百聞は一見にしかず、ということで“Examples with settings”からどのような動作か確認してみてください（初めて見たら結構驚く）。
今日、 写真拡大に便利なJavaScriptライブラリ （Highslide.js） – youmos で知ったのですが、画像の拡大プレビューを超クールに行える「Highslide JS」:phpspot開発日誌でも取り上げられていましたね（ということは一度見たことがあるはずだが、覚えがない）。
Movable Typeで画像をページ内でPopUp – Highslide JS/楽で、MTで実装する方法が紹介されています。MT から画像をアップロードすると、自動的にHighslide JS に適した HTML が生成されるようです。
Thickbox Gallery
さらに、Thickbox Gallery が凄い。PHPとThickbox JSを使用した簡易ギャラリースクリプト
という、これまたアリガチな物かと思いきや、Thickboxだけではなく、Lightbox JS v2.0, Highslide JS, Litebox
を利用することもできます。
Highslide JS を使ったサンプル もあります。表示に使う JavaScript ファイルは、設定ファイルを一部書き換えるだけで変更可能です。──たぶん、ちょっと PHP をかじったことがある人なら、動的に切り替えることもできそう（クッキー使ったり URL で切り替えたり？）。夢がひろがりんぐ。
画像拡大スクリプトを切り替えたい
ここからはいつものように、よく解ってないままに妄想。Highslide JS のサイトでは、下記のようなコードでサムネイルと拡大画像へのリンクを記述するように指定があります。
<a href="large-image.jpg" class="highslide"
onclick="return hs.expand(this)">
<img src="thumbnail.jpg"
alt="Highslide JS" title="Click to enlarge"
height="100" width="100" />
</a>
たぶん、onclick="return hs.expand(this)" は画像ひとつひとつに付けなくても、「特定の class が指定されたリンクタグをクリックすると働く」ようにできる、はず。とすると、クリックして発生するイベントも JavaScript で制御可能になる。ということは、拡大に使う JavaScript の切り替えができそう。
将来、もっと自分好みの画像拡大スクリプトが出てきても安心、というような記述方法はどんなものだろう？
<div id="main"><!-- 記事本文 -->
……
<a href="hoge.jpg" class="expand">
<img src="hoge.thumb.jpg"
alt="hoge 画像" title="クリックすると拡大！"
height="100" width="100" />
</a>
……
</div>
上記のように、「記事本文（id が main の div）」の中にある「class が expand（任意）のリンク」をクリックすると、画像拡大などの任意のイベントが発生──とすればいいわけか。
よし、ということで、さっそく作ってみたのが下記の
（省略されました 続きを読むにはこのサイト経由で Amazon/楽天の商品を 65535 個購入してください）
──てか、たぶん簡単に実装できると思う。
Enjoy!
asiamoth the Not Javascripter