Update carousel code to work on owl Carousel 2.3.4

hello

i have a quick view Popup plugin what work with owl carousel 1.3.2 but when i updated the owl.carousel.min.css and owl.carousel.min.js to latest version 2.3.4 the popup plugin don’t picture any more .

also the plugin images on owl style using this js cod :

 // Images Product  

                images.each(function(){

                    var el = $(this), thumb = thumbs;

                    el.owlCarousel({

                        direction : $("body").hasClass( "rtl" )?'rtl':'ltr',

                        singleItem:true,

                        pagination:false,

                        autoHeight:true,                        

                        afterAction : syncPosition,

                        navigation: true,

                        navigationText  : ["<i class=\'fa fa-angle-left\'></i>","<i class=\'fa fa-angle-right\'></i>"]

                    });

                    thumb.owlCarousel({

                        direction : $("body").hasClass( "rtl" )?'rtl':'ltr',

                        items : 4,

                        itemsDesktop      : [1199,4],

                        itemsDesktopSmall : [979,4],

                        itemsTablet       : [768,4],

                        itemsMobile       : [479,4],

                        pagination:false,

                        responsiveRefreshRate : 100,

                        navigation: false,

                        afterInit : function(el){

                          el.find(".owl-item").eq(0).addClass("synced");

                        }

                    });

                    function syncPosition(el){

                        var current = this.currentItem;

                        thumb

                          .find(".owl-item")

                          .removeClass("synced")

                          .eq(current)

                          .addClass("synced")

                        if(thumb.data("owlCarousel") !== undefined){

                          center(current)

                        }

                      }

                    thumb.on("click", ".owl-item", function(e){

                        e.preventDefault();

                        var number = $(this).data("owlItem");

                        el.trigger("owl.goTo",number);

                    });

                    function center(number){

                        var sync2visible = thumb.data("owlCarousel").owl.visibleItems;

                        var num = number;

                        var found = false;

                        for(var i in sync2visible){

                          if(num === sync2visible[i]){

                            var found = true;

                          }

                        }

                        if(found===false){

                          if(num>sync2visible[sync2visible.length-1]){

                            thumb.trigger("owl.goTo", num - sync2visible.length+2)

                          }else{

                            if(num - 1 === -1){

                              num = 0;

                            }

                            thumb.trigger("owl.goTo", num);

                          }

                        } else if(num === sync2visible[sync2visible.length-1]){

                          thumb.trigger("owl.goTo", sync2visible[1])

                        } else if(num === sync2visible[0]){

                          thumb.trigger("owl.goTo", num-1)

                        }

                    }

                });`
 

what i must change on it that it work with the owl carousel 2.3.4 ?

thanks

lahmar

Not sure really. If you can provide a minimal, runnable example that works in 1.3.2, but breaks in 2.3.4, I don’t mind having a look.

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.