-1

サイトを開発していて、いくつかの新しい機能を追加したいと考えています。私は Fancybox を使用しています。

問題は次のとおりです。

POI をクリックすると、いくつかの POI には複数の写真が含まれているため、次のコードを使用すると、fancybox が正しくトリガーされますが、ギャラリー全体ではなく 1 つの写真のみが表示されます。

私がしていることは、そのhtmlを非表示のdiv内にコピーして別のdivに追加して、正しくトリガーできるようにすることです.

動作しますが、写真は 1 枚しか表示されず、他の 2 枚以上の写真は表示されません。

私のhtml

   <div id="pois">  
    <div id="torrebenefebvlc" class="pointer hoversin" alt="2" style="margin-top: 295px; margin-left: 305px; position: absolute;">
<img src="http://www.vistadesarrollos.com/avancedeobra2/images/POI-90.png">
<div style="display:none">
<div id="slideimg" style="">
<a class="fancybox" href="http://www.vistadesarrollos.com/avancedeobra2/images/avance/torrebenefeb2013vlc.jpg" data-fancybox-group="gallery2" rel="gallery2">
<img style="" src="http://www.vistadesarrollos.com/avancedeobra2/images/avance/torrebenefeb2013vlc.jpg"></a>
<a class="fancybox" href="http://www.vistadesarrollos.com/avancedeobra2/images/avance/torrebenefeb2013vlc2.jpg" data-fancybox-group="gallery2" rel="gallery2">
<img style="" src="http://www.vistadesarrollos.com/avancedeobra2/images/avance/torrebenefeb2013vlc2.jpg"></a>
</div>
</div>
</div>
</div>

ご覧のとおり、これは私のファンシーボックスからの私のhtmlです。

JQUERY:



     function clickfotovid(){
    $("#pois div").click(function() {
        eldiv = $(this).find('div').find('div').html()
        //eltamano = eldiv.length;
        //alert(eldiv)
        /*if(eltamano > 97){

            slidershow(1,eldiv)
        }
        else{
            slidershow(0,eldiv)
        }*/
        fancyboxftw(eldiv)
    });


}

function fancyboxftw(html){

    $("#cargastuff").html("");
    $("#cargastuff").wrapInner("<div id='sliderimg'></div>")
    $("#sliderimg").html(html)
    $("#sliderimg a").each(function () {
    if ($(this).has('img').length) {
        $(this).fancybox();
        $("#sliderimg a:first").trigger('click')
    }
    });
}

何か案は?何が起こっている?ちなみに、親divの両方が非表示になっています。

編集:したがって、問題は、ギャラリーを実行する代わりに両方を表示するだけの2つ以上の画像がある場合でした。

編集2:

Fancybox は機能しますが、ギャラリーに画像が 1 つしか表示されません:/

編集3:

まだ何もない:/

編集4:

こちらがjsfiddle http://jsfiddle.net/yZ7N5/

4

2 に答える 2