AlexaShemetova
@AlexaShemetova
While I'm breathing - I love and believe

Как подружить fotorama4 и fancybox3?

Всем привет, я уже замучалась, подскажите пожалуйста как решить проблему :( Срабатывает фэнсибокс, но выводит только первую и вторую картинки с фоторамы. Для фэнсибокс никакой код не прописываю, все из под коробки через атрибуты. Для swiper в таком же виде все работает, для слайдера с миниатюрами взяла фотораму и такая проблема

<div class="fotorama" data-nav="thumbs" data-arrows="true" data-thumbwidth="210" data-thumbheight="110" data-click="false" data-swipe="false" data-thumbmargin="21">
                <div data-img="img/slide_1.jpg"><a href="img/slide_1.jpg" data-fancybox="gallery"></a></div>
                <div data-img="img/slide_2.jpg"><a href="img/slide_2.jpg" data-fancybox="gallery"></a></div>
                <div data-img="img/slide_3.jpg"><a href="img/slide_3.jpg" data-fancybox="gallery"></a></div>
                <div data-img="img/slide_4.jpg"><a href="img/slide_4.jpg" data-fancybox="gallery"></a></div>
            </div>
  • Вопрос задан
  • 311 просмотров
Решения вопроса 1
AlexaShemetova
@AlexaShemetova Автор вопроса
While I'm breathing - I love and believe
Не много поковыряла апи и того, и другого, решила проблему таким образом, может кому пригодится
$(function() {
        var $fotoramaDiv = $('.fotorama').fotorama();
        var fotorama = $fotoramaDiv.data('fotorama');
        var imagArr = fotorama.data;
        var srcArr = [];

        for(var i = 0; i < imagArr.length; i++){
            var src = {};
            src.src = imagArr[i].img;
            srcArr.push(src);
        }
        
        $('.fotorama__img').click(function(){
            $.fancybox.open(srcArr, {
                loop: false
            });
        });
    });
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
@Kostik_1993
Web Developer
Зачем вам Fancybox если вы используете фотораму?
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы