サイト内検索

...タグ・小技・etc...

jQuery

画像をthickboxで表示

[サンプル]

画像をクリック
サンプル
[指定方法]
1.ファイルをyuga.jsより、一括ダウンロードします。
2.画像を2枚用意します。
小さなサイズの画像と大きなサイズの画像を準備します。

画像に直リンクを張るだけでthickboxが動作します。

簡単にLightbox風の効果が得られます。

[メモ]

yuga.js」を参照させていただきました。

ソース

[headの中]

<link rel="stylesheet" href="css/thickbox.css" type="text/css"
media="screen" />
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/thickbox.js"></script>
<script type="text/javascript" src="js/yuga.js" charset="utf-8"></script>

[bodyの中]

<a href="img/大きな画像ファイル.jpg">
<img src="img/画像ファイル.jpg" width="180" height="120" alt="サンプル" />
</a>

Copyright c 2007.10.01 luc All rights reserved.