Fancybox меняет следующий и предыдущий источник изображений - PullRequest
0 голосов
/ 06 марта 2020

Мне просто интересно, есть ли способ изменить следующий и предыдущий источники изображений, прежде чем они будут нажаты? Мне просто нужно, чтобы Fancybox автоматически изменил размеры изображений, так как, когда я делаю это вручную после того, как пользователь нажал следующую или предыдущую кнопку (мне нужно сделать это вручную), размер не изменится, а иногда он растягивается. Есть ли атрибут fancybox, который позволил бы мне установить источник следующего и предыдущего изображений, чтобы он нормально работал на слайд-шоу и слайдере?

Пример моего кода для установки следующего источника изображения -

jQuery(".fancybox-arrow--right").on('click', function () {
        var next = parseInt(index) + 1 + count;
        if(next >= newborns.length)
        {
            console.log("Last Image");
            jQuery(this).prop('disabled', true);

        }
        else{
        console.log(next + ' Next');
        var newImg = new Image();
        newImg.src = newborns[next];
        var height = newImg.height;
        var width = newImg.width;
                if (height > width){
                //  jQuery(".fancybox-image").css("height","569px");
                //  jQuery(".fancybox-image").css("width","379px"); 
                /*  setTimeout(function(){
                    jQuery(".fancybox-image-wrap").css("transform","translate(274px, 44px) scale(1, 1)");   
                    },50);  */
                } else {
                //      jQuery(".fancybox-image").css("height","569px");
                //      jQuery(".fancybox-image").css("width","853px"); 
        /*      setTimeout(function(){                      
                        jQuery(".fancybox-image-wrap").css("transform","translate(136px, 44px) scale(1, 1)");
                    },50);  */                      
                }
        jQuery(".fancybox-image").attr("src", newborns[next]);          
        count++;
        }   
    });

Проблема в том, что это зависит от того, щелкает ли пользователь стрелкой, и изображение не изменяется должным образом, на слайд-шоу оно вообще не работает. По сути, у меня есть массив источников изображений, и я отслеживаю клики, по которым изображение нажимает пользователь, и беру индекс, по этому индексу я могу сказать, какое изображение будет следующим или предыдущим, но это известно только после того, как пользователь нажал на образ. Ребята, есть ли у вас какие-либо предложения относительно того, как мне подходить к этому?

1 Ответ

0 голосов
/ 17 марта 2020

Похоже, вы пытаетесь решить что-то не с того конца. Не усложняйте вещи.

1) Либо создайте свой собственный обработчик кликов, который 1) Создает элементы галереи; 2) Затем запускает fancybox вручную;

2) Или использует beforeLoad callback для манипуляции с источником изображения. Вы также можете использовать afterLoad обратный вызов для настройки размеров изображения (https://codepen.io/fancyapps/pen/gdVyxg?editors=1010)

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...