2012年に最も役だったjQuery Pluginでご紹介した中からさっそく使ってみたいプラグインを使ってみました。

<!-- jQuery -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>

<!-- Make IE8 and below responsive by adding CSS3 MediaQuery support -->
<!--[if lt IE 9]>
  <script type='text/javascript' src='http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js'></script> 
<![endif]-->

肝となるjavascriptとCSSを読み込みます。

<!-- Fresco -->
<script type="text/javascript" src=js/fresco/fresco.js"></script>
<link rel="stylesheet" type="text/css" href=css/fresco/fresco.css" />

そしてそして！画像のリンクに

<a href='images/frans_hals.jpg' 
		     class='fresco' 
		     data-fresco-group='example' 
		     data-fresco-caption="Frans Hals, Banquet of the Officers of the St George Civic Guard, 1627">
		    <img src='images/thumbnails/frans_hals.jpg' alt=''/>
		  </a>

ライトボックスつけるのにclass=’fresco’ でdata-fresco-group=’グループ名’でグループ名をつけて data-fresco-caption=”画像のキャプション”っということですね。
ん～、やっぱりいいですこれは！
だけど、ライセンスが non-commercial licenseですね。

サンプルダウンロード：http://www.frescojs.com/download