Fancybox принудительно загружает первое изображение (индекс), работает не так, как ожидалось

Question

Я использую пользовательские next и previous, чтобы позволить пользователю перемещаться между несколькими галереями fancybox, что хорошо работает. Однако, при переходе между галереями, по какой-то причине fancybox автоматически выбирает последнее изображение в галерее.

Мне нужно добавить способ заставить fancybox всегда загружать первое изображение галереи при его запуске. По умолчанию индекс равен 0, что немного сбивает с толку, почему он меняется.

Идеи? Вот мой код

Вот код, с которым я работаю:

var $thisFancyRel = 0;
var $itemsPerPage = 9;
$(".fancybox").fancybox({
    index : 0,
    helpers : {
        title   : {
            type: 'outside'
        },
        thumbs  : {
            width   : 50,
            height  : 50
        }
    },
    afterLoad : function() {
        var $self = $(this.element);
        $thisFancyRel = parseInt($($self).attr("rel"));
    },
    afterShow : function() {
        $button_next = "<div class='gallery__next'>Next</div>";
        $button_prev = "<div class='gallery__prev'>Previous</div>";
        $button_clear = "<div class='clearboth'></div>";
        if($thisFancyRel > 0) {
            if($thisFancyRel == 1) {
                $buttons = $button_next + $button_clear;
            } else if ($thisFancyRel == $itemsPerPage) {
                $buttons = $button_prev + $button_clear;
            } else {
                $buttons = $button_prev + $button_next + $button_clear;
            }
        }
        $(".fancybox-skin").after($buttons);
    },
    beforeClose : function() {
        $thisFancyRel = 0;
    }
});
$(document).on("click", ".gallery__next", function () {
    var $nextFancyRel = $thisFancyRel + 1;
    if($nextFancyRel > 0) {
        var $relName = '.fancybox[rel="' + $nextFancyRel + '"]';
        $.fancybox.close();
        $($relName).trigger('click');
    }
});
$(document).on("click", ".gallery__prev", function () {
    var $prevFancyRel = $thisFancyRel - 1;
    if($prevFancyRel > 0) {
        var $relName = '.fancybox[rel="' + $prevFancyRel + '"]';
        $.fancybox.close();
        $($relName).trigger('click');   
    }
});

Answer 1

index Опция работает, если вы запускаете свою галерею прямо с привязки, привязанной к fancybox.

С другой стороны, если вы запускаете свою галерею вручную или используете другой элемент в качестве триггера, то галерея будет начинаться с последнего найденного элемента.

Вы можете использовать .eq() способ запустить галерею с первого элемента (или любого другого элемента), поэтому попробуйте это в своем коде

$($relName).eq(0).trigger('click')

Вы также можете увидеть этот /questions/21119613/vyizyivaya-galantereyu-s-drugoj-ssyilkoj/21119623#21119623 для справки.

Кстати, если вы запускаете новую галерею, вам не нужно закрывать fancybox, чтобы вы могли удалить $.fancybox.close(); (открытие нового экземпляра закроет открытую коробку, если есть)