jquery の fancybox プラグインを使って画像ポップアップ

画像拡大ポップアップを使いたかったので、
jquery の fancybox プラグインを使って実装してみた

動作サンプルはこちら

必要なものを読み込んで

<link rel="stylesheet" href="./fancybox/jquery.fancybox.css" media="screen" type="text/css">
   <script type="text/javascript" src="./jquery/jquery-1.3.2.min.js">script>

<script type="text/javascript" src="./jquery/jquery.easing.1.3.js">script>
   <script type="text/javascript" src="./fancybox/jquery.fancybox-1.2.1.js">script>

から、

<a href="http://www.blogger.com/large.jpg"><img src="./small.jpg" /></a>

大きい画像をリンク先に指定し、サムネイルをimgタグで表示させる。
あとは

<script>
$(document).ready(function() {
    $('a').fancybox();
});
</script>

 で、すべてのaタグにfancyboxを適用させている。

外部のHTMLを読み込んでポップアップさせることもできるが、
FC2だと、強制的に表示されるフッタの表示に使うjavascriptと
干渉して、うまく表示出来なかった。
# 単なる画像拡大はできた



ポップアップトースター PT-850(SB) シルバーブラック