Fancybox組圖像無重複

如何將多個圖像分組而不使用fancybox重複？我嘗試過使用rel =「group」，雖然這會顯示最近的圖像列表。Fancybox組圖像無重複

我有以下HTML：

<ul>  
    <li>   
     <a rel="group1" class="fancy" title="Custom title" href="http://farm3.static.flickr.com/2641/4163443812_df0b200930.jpg">   <img alt="" src="http://farm3.static.flickr.com/2641/4163443812_df0b200930_m.jpg">  </a>   
     <h2><a rel="group1" class="fancy" title="Custom title" href="http://farm3.static.flickr.com/2641/4163443812_df0b200930.jpg">Test title about image</a></h2>  
    </li>  
    <li>   
     <a rel="group2" class="fancy" title="Custom title" href="http://farm3.static.flickr.com/2641/4163443812_df0b200930.jpg">    
      <img alt="" src="http://farm3.static.flickr.com/2641/4163443812_df0b200930_m.jpg">   
     </a>   
     <h2><a rel="group2" class="fancy" title="Custom title" href="http://farm3.static.flickr.com/2641/4163443812_df0b200930.jpg">Test title about image</a></h2>  
    </li>  
    <li>   
     <a rel="group3" class="fancy" title="Custom title" href="http://farm3.static.flickr.com/2641/4163443812_df0b200930.jpg">    
      <img alt="" src="http://farm3.static.flickr.com/2641/4163443812_df0b200930_m.jpg">   
     </a>   
     <h2><a rel="group3" class="fancy" title="Custom title" href="http://farm3.static.flickr.com/2641/4163443812_df0b200930.jpg">Test title about image</a></h2>  
    </li>  
    <li>   
     <a rel="group4" class="fancy" title="Custom title" href="http://farm3.static.flickr.com/2641/4163443812_df0b200930.jpg">    
      <img alt="" src="http://farm3.static.flickr.com/2641/4163443812_df0b200930_m.jpg">   
     </a>   
     <h2><a rel="group4" class="fancy" title="Custom title" href="http://farm3.static.flickr.com/2641/4163443812_df0b200930.jpg">Test title about image</a></h2>  
    </li> 
</ul>

來源

2012-07-03 John Magnolia

你缺少fanybox JS ... – powtac

是啊jsfiddle運行速度真的很慢，並沒有上傳JS。我已經刪除了這個。漂亮毫無意義，因爲它只是一個基本的fancybox示例 –

現在WASN那太容易了：

<li>   
     <a rel="group1" class="fancy" title="Custom title" href="http://farm3.static.flickr.com/2641/4163443812_df0b200930.jpg">    
      <img alt="" src="http://farm3.static.flickr.com/2641/4163443812_df0b200930_m.jpg">   
     </a>   
     <h2><a rel="group2" class="fancy" title="Custom title" href="http://farm3.static.flickr.com/2641/4163443812_df0b200930.jpg">Test title about image</a></h2>  
    </li>

來源

2012-07-03 13:12:49

是的，你可以創建兩個獨立的組，像這樣 - http://jsfiddle.net/K44HR/1/ - 但如果使用彈性openEffect/closeEffect，我的第一個演示會更好，因爲動畫將從縮略圖開始， – Janis

你可以觸發點擊「花哨」鏈接的情況下，這樣的 - http://jsfiddle.net/K44HR/

（調整jQuery選擇，如果需要的話）

來源

2012-07-03 12:11:59 Janis

這不是我的問題，但它幫助了我。我通過調整jQuery選擇器來解決Fancybox的雙重圖像。 – Feuda

Fancybox組圖像無重複

回答

相關問題