猫头鹰轮播忽略项目选项

Question

我对猫头鹰传送带有问题。当我将大型图像与items:1一起使用时，一切工作正常，每张幻灯片都包含1张图像。但是当我使用较小的图像时，items:1选项将被忽略，并且每张幻灯片显示4张图像。

owlcarousel的版本为2.3.4，相应的CSS文件也是如此。

$(document).ready(function(){
            $(".news-post-gallery").owlCarousel({
                navigation : false, // Show next and prev buttons
                autoplay:false,
                items: 1,
                loop:false,
                margin: 10,
                center: true,
                nav: true,
                navText: [
                    "<div>Left</div>",
                    "<div>Right</div>"
                ],
                responsive:{
                    0:{
                        items:1,
                    }
                }
            });
        });

我的第一个猜测是这是CSS问题。请注意，即使是小图像也不是那么“小”，我使用的大图像就像是我的屏幕宽度的一半。

编辑：使用小图像时，navText也将被忽略。

Answer 1

问题是另一个旋转木马正在针对owl-carousel类进行初始化。最终用错误的设置初始化了我需要的那个。轮播初始化来自不同的模板，因此仅在页面加载后结果才在源中可见。

在初始化我的我的对象之前添加$(...).owlCarousel('destroy');解决了这个问题。