A
A
Alexandra2020-05-31 14:49:32
JavaScript
Alexandra, 2020-05-31 14:49:32

How to make friends between fotorama4 and fancybox3?

Hello everyone, I'm already tormented, please tell me how to solve the problem :( Fancybox works, but displays only the first and second pictures from the photoframe. I don't write any code for the fantasybox, everything is from under the box through attributes. For swiper in the same form, everything works, for the slider with thumbnails I took a photo frame and such a problem

<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>

Answer the question

In order to leave comments, you need to log in

2 answer(s)
A
Alexandra, 2020-05-31
@AlexaShemetova

I didn’t pick a lot of api for both, I solved the problem in this way, maybe it will come in handy for someone

$(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
            });
        });
    });

K
Konstantin B., 2020-05-31
@Kostik_1993

Why do you need Fancybox if you are using a photo frame?

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question