javascript - Fancybox: 異なる DIV 内の次の画像と前の画像?

Question

HTML 構造は次のようになります。

<div id="gallery" class="container">

    <div class="thumbs-holder">
        <div class="thumbs-center-area">
            <div class="thumb-back">
                <a class="fancybox" href="images/image1.jpg">
                    <img class="thumb" src="images/thumbnails/image1.jpg" title="Image 1" />
                </a>
            </div>
        </div>
    </div>

    <div class="thumbs-holder">
        <div class="thumbs-center-area">
            <div class="thumb-back">
                <a class="fancybox" href="images/image2.jpg">
                    <img class="thumb" src="images/thumbnails/image2.jpg" title="Image 2" />
                </a>
            </div>
        </div>
    </div>

    ...

</div>

上記のコードでは、サムネイルをクリックすると、ライトボックスの画像 (fancybox) が開きますが、ライトボックスの「次へ」ボタンと「前へ」ボタンを取得して、次の div から画像を取得することはできません。1 つの div からの画像のみを表示します。

ファンシーボックスの「前」と「次」をこのようなHTML構造で機能させるにはどうすればよいですか?