2016-09-02 31 views
0

fancyBoxを使用します。ここでは画像を<a>にラップし、そこをクリックすると拡大表示されます。ただし、前の次の画像にもナビゲートすることができます。私のアプリケーションでは、パネルがあるので、最初のパネルの画像に移動したいのですが、ではありません。は、最初のパネルの最後の画像から第2パネル画像内を移動する

これを行う方法はありますか?

<!-- in the first panel --> 
<a class="fancybox" rel="group" href="img0"><img src="img0"/></a> 
<a class="fancybox" rel="group" href="img1"><img src="img1"/></a> 

<!-- in the second panel --> 
<a class="fancybox" rel="group" href="img2"><img src="img2"/></a> 
<a class="fancybox" rel="group" href="img3"><img src="img3"/></a> 

私はこれを行う方法を、「IMG2」に「IMG1」からナビゲートできるようにしたくないですか?


私は relが役立つだろうと思ったが、第二パネルにランダムな名前に設定するとトリックを作るように見えませんでした!

答えて

1

rel属性を持つFancbox website、あなたがすべきグループあなたのギャラリーをから:

注 - ギャラリーが同じ "REL" タグを持つ要素から作成され、例:

/* HTML */ 
<a class="grouped_elements" rel="group1" href="image_big_1.jpg"><img src="image_small_1.jpg" alt=""/></a> 
<a class="grouped_elements" rel="group1" href="image_big_2.jpg"><img src="image_small_2.jpg" alt=""/></a> 

<a class="grouped_elements" rel="group2" href="image_big_3.jpg"><img src="image_small_3.jpg" alt=""/></a> 
<a class="grouped_elements" rel="group2" href="image_big_4.jpg"><img src="image_small_4.jpg" alt=""/></a> 

/* This will create two galleries */ 

$("a.grouped_elements").fancybox(); 
関連する問題