サムネイルとメイン画像付きギャラリーのjQuery lightBoxプラグイン

Question

サムネイル画像をクリックすると、メイン画像が関連するフルサイズの画像に更新されます。

サムネイル画像：

<a href="/images/<?php echo $product->image; ?>" onclick="$('#main-image').attr('src', '/images/<?php echo $product->image; ?>'; $('#main-image-link').attr('href', this.href); return false;"> 
    <img src="/images/<?php echo $product->image; ?>" alt="" /> 
</a> 

メイン画像：

<a id="main-image-link" href="/images/<?php echo $product->image; ?>" class="lightbox"> 
    <img src="/images/<?php echo $product->image ?>" alt="" id="main-image" /> 
</a> 

そして、ここでは、ライトボックスのコードです：

$(function() { 
    $('a.lightbox').lightBox(); 
}); 

http://leandrovieira.com/projects/jquery/lightbox/

あなたが見ることができるように、光メイン画像をクリックするとボックスが有効になります。私が抱えている問題は、メインイメージをクリックするとそのイメージのライトボックスだけが表示されるということです。

私が望むのは、すべての画像（現在選択されているメイン画像のライトボックスを開始点として）を表示するライトボックスを表示することです。

Answer 1

LightBoxプラグインがこれを自動的に行います。その後

<a class="lightbox" href="image1.jpg"><img src="image1thumb.jpg" /></a> 
<a class="lightbox" href="image2.jpg"><img src="image2thumb.jpg" /></a> 
<a class="lightbox" href="image3.jpg"><img src="image3thumb.jpg" /></a> 

...

$('A.lightbox').lightBox(); 

ページ上のリンク/画像を入れたくない場合は、単にCSS display: noneを使用しています。

Answer 2

Example pageと同じように、ギャラリーを最初に稼働させる必要があります（並べ替えられていないリストを作成すると、次の以前のナビゲーションが動作することが確認されます）。

$(function() { 
    $('#gallery a').lightBox({fixedNavigation:true}); 
}); 

そして、それはあなたがプラグインの基本的な機能の上でやっている何かのカスタムだだけなので、あなたは、あなたのメイン画像をリフレッシュするロジックを追加します。