將fancybox整合到galleriffic中

Question

我想將fancybox的一些功能整合到galleriffic中。基本上我想要有一個使用galleriffic各自的縮略圖的圖像庫。除了樣式我的方法看起來非常相似：http://www.twospy.com/galleriffic/example-2.html 此外，我想能夠放大顯示的圖像。對於這樣的prupose我使用fancybox。其行爲的一個例子可以在這裏找到http://fancyapps.com/fancybox/demo/

我設法做什麼上述我稍微修改galleriffic buildImage功能把它當作如下：

.append('<span class="image-wrapper current"><a class="advance-link fancybox" rel="group" href="'+imageData.image.src+'" title="'+imageData.title+'">&nbsp;</a></span>') 

現在，galleriffic添加的fancybox類的fancybox需求以及圖像源。這很奇妙。

在這一點上，我發現一個問題，我似乎沒有找到一個乾淨的解決方案。 Fancybox允許通過點擊每幅圖像的右側/左側來瀏覽圖像集合，以轉到集合中的下一個/上一個圖像（正如您在上面提供的演示中可能已經注意到的那樣）。我也想利用這個功能，以便用戶可以通過瀏覽Galleriffic的縮略圖，以及通過使用fancybox的圖像的縮放版本瀏覽圖庫。

我在這裏找到的問題是，galleriffic只爲縮略圖被點擊的圖像創建了class =「fancybox」。這使得fancybox只能找到圖庫的一個圖像。我不想將類fancybox定義爲定義galleriffic拇指的類，因爲我不希望圖像在縮略圖上單擊時縮放，而是在主圖像上縮放。

從某種意義上說，我需要的是用fancybox類生成所有的類，但隱藏所有未顯示的內容，而不是每次通過galleriffic生成所需的內容。這是我能想出的唯一解決方案，但它並不整齊。我喜歡每次單擊縮略圖時如何處理生成主圖像的情況。

我在想，如果有人能想出一個更好的解決方案。例如，fancybox可以通過搜索下一個galleriffic縮略圖來知道下一個圖像。

我試圖做一個工作jsfiddle演示，但涉及太多的代碼。也沒有明確的問題，但實施的conclict。我認爲你可以輕鬆地複製我目前的狀況。

感謝您的努力！

Answer 1

我試過你的方法，編輯BuildImage函數，就像你做的那樣。對我而言，它成功鏈接到圖像，但不加載FancyBox。

我有這樣的代碼在主文件：

<script type="text/javascript"> 
    $(document).ready(function() { 
     $(".fancybox").fancybox(); 
    }); 
</script> 

你是成功的結合了兩下，是否正確？