0

fancyboxを使用して、重複することなく複数の画像をグループ化するにはどうすればよいですか？rel = "group"を使用してみましたが、最近の画像のリストが表示されます。

私は次の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>
4

2 に答える 2

4

次のように、「ファンシー」リンクのクリックイベントをトリガーできます-http://jsfiddle.net/K44HR/

（必要に応じてjQueryセレクターを調整します）

于 2012-07-03T12:11:59.787 に答える
0

今はそれほど簡単ではありませんでした：

<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-03T13:12:49.093 に答える