Fancybox畫廊與不同地方的圖​​像

Question

我有一個圖像庫（所有圖像在一起）和一個單獨的圖像（html）頁面。

我把所有的圖片從圖片庫中

<div id="imageGallery"> 

我把單獨的圖像中的

<div id="separateImage"> 

和我的JavaScript

$('#imageGallery a').fancybox(); 
$('#separateImage a').fancybox(); 

的fancybox工作正常在圖像庫和單獨的圖像上。我可以在圖像庫中循環，但是，單獨的圖像不是循環的一部分。我怎樣才能讓它循環遍歷所有圖像：來自圖庫和獨立圖像的圖像？

我嘗試添加

rel="gallery" 

到錨截至https://www.inkling.com/read/javascript-jquery-david-sawyer-mcfarland-2nd/chapter-7/advanced-gallery-with-jquery

解釋，但顯然，如果所有圖像都在同一div（ID），這僅適用！？

Answer 1

的問題是，你要綁定的fancybox兩種不同的選擇：

$('#imageGallery a')和$('#separateImage a')，但爲了使畫廊，所有元素是否它們是相同的div與否之內，需要使用相同的選擇（的fancybox V2.X）

所以無需硬碼手動每個各自的元件分開div，你可以做：

$("#imageGallery a, #separateImage a") 
    .addClass("fancybox") 
    .attr("rel", "gallery") 
    .fancybox({ 
     //API options 
     padding: 8 // example 
    }); 

現在所有元素無論其位置如何共享類和rel屬性。

見JSFIDDLE