Мне нужно синхронизировать 2 сова карусель - PullRequest
0 голосов
/ 27 июня 2019

У меня есть этот веб http://crigamex.wizerlink.net/

Мне нужна синхронизация 2 карусели введите описание изображения здесь

Мне нужно это https://jsfiddle.net/owcfjaht/ попробуй но с ошибкой

 var owl1 = sync1.data("owlCarousel").owl; var owl2 = sync2.data("owlCarousel").owl;

но это было сделано в версии 1, и я использую версию 2

  var owl_1 = $('#owl-1');
  var owl_2 = $('#owl-2');

  owl_1.owlCarousel({
    loop:true,
    margin:10,
    nav:true,
    items: 1,
    dots: false,
    navText: ["<i class='fa fa-chevron-left fa-2x'></i>","<i class='fa fa-chevron-right fa-2x'></i>"]
  });

  owl_2.owlCarousel({
    loop:true,
    margin:10,
    nav: false,
    dots: false,
    responsive:{
            0:{
                items:1
            },
            768:{
                items:4
            },
            992:{
                items:4
            },
            1200:{
                items:4
            }
        }
  });

  owl_2.find(".item").mousedown(function(){
    var slide_index = owl_2.find(".item").index(this);
    owl_1.trigger('to.owl.carousel',[slide_index,300]);
  });

1 Ответ

0 голосов
/ 28 июня 2019

мой код!

 var owl_1 = $('#owl-1');
  var owl_2 = $('#owl-2');

  owl_1.owlCarousel({
    loop:true,
    margin:10,
    nav:true,
    items: 1,
    dots: false,
    navText: ["<i class='fa fa-chevron-left fa-2x'></i>","<i class='fa fa-chevron-right fa-2x'></i>"]
  });

  owl_2.owlCarousel({
    touchDrag  : false,
    mouseDrag  : false,
    loop:true,
    margin:10,
    nav: false,
    dots: false,
    responsive:{
            0:{
                items:1
            },
            768:{
                items:4
            },
            992:{
                items:4
            },
            1200:{
                items:4
            }
        }
  });
  owl_2.find(".item").click(function(){
    var slide_index = owl_2.find(".item").index(this);
    owl_1.trigger('to.owl.carousel',[slide_index,300]);
  });


  owl_1.on('changed.owl.carousel', function (e) {
    control=e.relatedTarget.current()
    owl_2.trigger('to.owl.carousel',[control+1,1000],true);// mueve el 2do carrousel

  }) 
...