Нажмите, чтобы открыть детский HTML в fancyBox и связать их

Question

Нажмите, чтобы открыть детский HTML в fancyBox и связать их

0

У меня есть этот проект, где я не могу комбинировать изображения в один композитный, поэтому у меня должно быть 2 изображения на один оверлей. До сих пор эта скрипка ниже делает трюк, но я не могу для жизни меня понять, как получить спину и следующие кнопки, чтобы связать их друг с другом.

http://jsfiddle.net/PFVxK/1344/

HTML

<div class="image">
    <div rel="gallery1">
        <img src="http://placehold.it/300x300/B7AF90/FFFFFF&text=Before" />
        <img src="http://placehold.it/300x300/B7AF90/FFFFFF&text=After" />
        <p class="title">Title Goes Here</p>
    </div>
    <br style="clear:both;" />
</div>
<div class="image">
    <div rel="gallery1">
        <img src="http://placehold.it/300x300/B7AF90/FFFFFF&text=Before2" />
        <img src="http://placehold.it/300x300/B7AF90/FFFFFF&text=After2" />
        <p class="title">Title Goes Here</p>
    </div>
    <br style="clear:both;" />
</div>

JQuery

$(".image").click(function () {

    $.fancybox({
        type: 'html',
        content: $(this).children().html()
    }).attr('rel', 'gallery1');

});

Christina 12 нояб. 2013, в 17:17

Источник

Теги:

jquery

fancybox

fancybox-2

1 ответ

Ещё вопросы

JFK · Accepted Answer · 2013-11-12T15-37-00.000Z

Проблема в том, что вы запускаете fancybox с помощью ручного метода (click), чтобы вы не могли иметь галерею таким образом, если вы не установите элементы галереи внутри самого скрипта.

Попробуйте вместо этого вариант:

var images = [];
$(".image").each(function(i){
    images[i] = $(this).children().html();
    $(this).on("click", function(){
        $.fancybox(images,{
            index: i,
            type: 'html'
        });
    })
});

Обратите внимание, что .on() требует jQuery v1. 7+

См. JSFIDDLE

Большое вам спасибо. Я использую 2.0.3 jQuery для современных и ie8 получает 1.8.3, так что это прекрасно работает !!!