WEBシステム開発/Ajax/Lightbox2を使って、画像の表示をカスタマイズする
ブログに使われだして?一気にブレークした感じがする
Lightbox系の各スクリプトですが
その使い方はいたって簡単であり
各スクリプト、及びスタイルシートを読み込んで
<script type=”text/javascript” src=”js/prototype.js”></script>
<script type=”text/javascript” src=”js/scriptaculous.js?load=effects,builder”></script>
<script type=”text/javascript” src=”js/lightbox.js”></script>
<link rel=”stylesheet” href=”css/lightbox.css” type=”text/css” media=”screen” />
イメージタグにのrel指定をしてやれば、直ぐに画像表示をカスタマイズする事が
できます。
<a href=”images/image-1.jpg” rel=”lightbox” title=”my caption”>image #1</a>
非常に簡単ですね。
味気ない画像表示を、アニメーションを使って効果的にカスタマイズするだけで
コストをかけない演出をだせますよね。
■Lightbox2デモ
www.huddletogether.com/projects/lightbox2/#example
■Lightbox2
www.huddletogether.com/projects/lightbox2/#download