PopBox!

というウェブページ上でイメージをリサイズしたりできるjavascriptが面白そうだけど
サイト英語だし日本語で解説してる所が無いので
javascriptも英語もさっぱりだけど小一時間くらいがんばってとりあえず動いたメモ。

ちなみにサイトはこちら

ダウンロードした中身のPopBox.jsとimagesディレクトリを鯖に上げとく
Styles.cssを動作させるページに読み込むなり中身を追記するなりする
HEADにこれを追加する

	<script src="scripts/PopBox.js" type="text/javascript"></script>
<script type="text/javascript">
	popBoxWaitImage.src = "/images/spinner40.gif";
	popBoxRevertImage = "/images/magminus.gif";
	popBoxPopImage = "/images/magplus.gif";
</script>

拡大させたいイメージはとりあえずこんな感じに書く

<img id="top1" alt="" title="top1" src="top1.jpg"
			class="PopBoxImageSmall" style="width: 150px;
			height: 113px;"
			onclick="Pop(this,50,'PopBoxImageLarge');" />

idは省略できる、titleは拡大したときに画像の下に出る
pbsrc="largetop.jpg"を追加すると拡大画像はlargetop.jpgになる
ほかにもパラメータとかあって色々できるらしいが拡大縮小できれば十分だからこれでいいや。
メモなのでわかりにくいのは仕様です。詳しく知りたい人は英語を読んでください。
ギャラリーに早速これ使ってみようかな。