次回と前回の機能のfancyboxアイテムをグループ化する

Question

fancyboxプラグインは自分のサイトでは動作しますが、単一の画像のみで動作するので、それらの間をスクロールすることも、next-prevボタンで切り替えることもできません。私はfancyboxがこれを可能にするためにグループを見る必要があることを知っているが、私はここで立ち往生し、まだ単一の画像しか得ていない。ここにjQueryのスニペットとHTMLの構造があります：

何か助けてくれてありがとう。ここで

$('dl.gallery-item').each(function(index) { 
    var rel = "group"; // +$(this).attr('id'); 
    $('.gallery-item a').addClass('fancybox').attr('rel', rel); 

}); 
$('.fancybox').fancybox(); 

<div id="gallery-1" class="gallery galleryid-15 gallery-columns-4 gallery-size-thumbnail"> 
     <dl class="gallery-item"> 
      <dt class="gallery-icon landscape"> 
       <a href="//localhost:3000/path-to-image" class="fancybox" rel="group"><img width="253" height="164" src="path-to-image" class="attachment-thumbnail size-thumbnail" alt=""></a> 
      </dt></dl><dl class="gallery-item"> 
      <dt class="gallery-icon landscape"> 
       <a href="//localhost:3000/path-to-image" class="fancybox" rel="group"><img width="253" height="164" src="path-to-image" class="attachment-thumbnail size-thumbnail" alt=""></a> 
      </dt></dl><dl class="gallery-item"> 
      <dt class="gallery-icon landscape"> 
       <a href="//localhost:3000/path-to-image" class="fancybox" rel="group"><img width="253" height="164" src="path-to-image" class="attachment-thumbnail size-thumbnail" alt=""></a> 
      </dt> 
     </dl> 
</div> 

Answer 1

は作業Fancyboxの実装を使用してHTMLである：
https://jsfiddle.net/alan0xd7/z3h8zf65/

これは、最新のFancyboxバージョン3.0.47

を基本的に唯一の変化ではなく、relを使用してのものであり、それがされて使用されますグループの場合はdata-fancyboxです。

あなたがそれを動作させることができない場合、私のフィドルを編集し、あなたのコードがどのように見えるかを示してください。

希望すると便利です。