サイト作成時の覚書として、URLを記載しておきます。
ThickBox http://jquery.com/demo/thickbox/
これは、イメージやflashムービーをページ内の別窓に簡単に表示させることができます。
縮小イメージをクリックして大きなイメージを出す場合にそのためのページを用意したりしなければいけなかったのが、簡単にイメージのリンクに変数と表示窓のタイトルを入れるだけで、ウィンドウ内中心に大きなイメージが表示できます。さらに "rel”にて各イメージを関連付けると表示された窓内で次のイメージに表示が変わり簡単なスライドショーのできあがりです。
使用するのは 上のサイトにて入手可能な
jquery-1.2.1.js
thickbox.css
thickbox.js
3つのファイルをダウンロードして、使用したいページでheader内に下記を追加するだけ
<script type="text/javascript" src="Scripts/jquery-1.2.1.js"></script>
<script type="text/javascript" src="Scripts/thickbox.js"></script>
<style type="text/css">
@import url("Scripts/thickbox.css");
</style>
そして、リンクに
<a href="new/images/49-11.jpg" class="thickbox" title="拡大画像" rel="bigimage"><img src="new/images/49-11-s.jpg" width="100" height="100" border="0"></a>
とすると、リンクをクリックでページ全体に黒のマスクがかかり中心にリンク画像が表示されます。
さらに、rel部分を同じにして何個かのイメージのリンクをつくるとどのリンクをクリックしても、簡単なスライドショーができます。
中に、Flashのムービーを表示する場合は
簡単な表示用HTMLファイルを用意してそのファイルに下記のようなリンクをはるだけ
<a href="flash5.html?keepThis=true&TB_iframe=true&height=250&width=330" class="thickbox" title="flash movie">ページ内でムービー再生</a>
これで、無駄にページ間を移動しなくてすみます。

ランキングに参加しています。 クリックお願いします。