[我使用猫头鹰传送带，在移动视图中，我只想显示单个项目。但是，当我单击下一个按钮时，第二个项目从左侧被剪切掉

Question

我使用猫头鹰轮播进行移动查看。我只显示一个项目，但是当我单击“下一步”按钮时，第二个项目从左侧被剪切。我还包括owl.carousel.css

if (jQuery(window).width() <= 767) {
  jQuery('.owl-carousel').owlCarousel({
    stagePadding: 0,
    loop: false,
    responsiveClass: true,
    dots: false,
    nav: true,
    autoHeight: true,
    items: 1
  });
}

.owl-stage {
  width: auto !important;
  white-space: nowrap;
  position: relative;
  display: -webkit-inline-box;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-box;
  display: box;
}

.owl-item.active {
  opacity: 1;
}

.owl-item {
  opacity: 0;
  position: relative;
  min-height: 1px;
}

First Item of OwlcarouselSecond Item of Owlcarousel

Answer 1

[Owl-carousel具有用于响应视图的API。您可以从此处控制要显示的滑块数量。这是一个演示https://owlcarousel2.github.io/OwlCarousel2/demos/responsive.html因此，尝试使用

responsive : {
    // breakpoint from 0 up
    0 : {
        items: 1
    },
    // breakpoint from 768 up
    768 : {
        items: 3
    }
}