2017-05-03 12 views
0

クリックしたときに各サムネイルが別のギャラリーに開くようにfancyboxを変更しようとしています。今のファンシーボックスは、表示されているすべてのサムネイルをスクロールします。Jquery Fancy Box with thumbnails with separate gallery

私はこれを行うための複数の方法を探しました。多くはrelタグとhidddenタグを含みますが、全体的には何も動作していないようです。

思考? 基本的には今、私は列システムにページを設定しました。 3x3グリッドの親指を持ち、それぞれが自分の画像のギャラリーを開くようにします。

+0

は[そう]へようこそ!このサイトでは、自分でコードを書くことができます**。 ** [もっと研究をして](// meta.stackoverflow.com/questions/261592)**あなたが問題を抱えていると、あなたが試みたものを投稿することができます** (** stackoverflow.com/help/mcve)を提供しています。私は良い質問と[完璧な質問]を読むことをお勧めします(http://codeblog.jonskeet.uk/2010/08/29/writing-the-perfect-question/)。また、[ツアー]を取って** [this](// meta.stackoverflow.com/questions/347937/)**を必ず読んでください。 – Badacadabra

答えて

0

ギャラリーごとに最初のサムネイルのみを表示できます。

ドキュメントからチェック最初の例 - http://codepen.io/fancyapps/pen/jyEGGG/?editors=1000

<h3>Gallery with one preview image</h3> 
<p> 
    <a href="https://c1.staticflickr.com/1/357/31876784275_12286240d4_h.jpg" data-fancybox="images-single"> 
     <img src="https://c1.staticflickr.com/1/357/31876784275_fbc9696913_m.jpg" /> 
    </a> 
</p> 

<div style="display: none;"> 

    <a href="https://farm3.staticflickr.com/2947/33594572585_b48eba935b_k_d.jpg" data-fancybox="images-single" 
    data-thumb="https://farm3.staticflickr.com/2947/33594572585_46ca00f3a5_m_d.jpg"></a> 

    <a href="https://farm3.staticflickr.com/2859/33395734202_522f9d8efd_k_d.jpg" data-fancybox="images-single" 
    data-thumb="https://farm3.staticflickr.com/2859/33395734202_15a81c4ef3_m_d.jpg"></a> 

</div>