jquery - OwlCarousel 2 slideBy 不适用于触摸和鼠标拖动

Question

我使用 OwlCarousel 2.3.4 并想使用 slideBy 选项以 2 为单位滑动元素，但这个 future 只能使用点或导航而不是滑动或鼠标拖动。我想要实现的是，当您触摸或拖动时，将旋转木马滑动 2 个元素，但它仅在您单击箭头或点时有效。我该怎么做？

$(".owl-carousel").owlCarousel({
  loop: true,
  nav: true,
  touchDrag: true,
  mouseDrag: true,
  items: 2,
  slideBy: 2,
  margin: 10
});

.owl-carousel .owl-nav button.owl-next,
.owl-carousel .owl-nav button.owl-prev,
.owl-carousel button.owl-dot {
  font-size: 100px!important;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css" />
<link rel="stylesheet" href="https://owlcarousel2.github.io/OwlCarousel2/assets/css/docs.theme.min.css" />

<div id="demos">
  <div class="owl-carousel owl-theme">
    <div class="item">
      <h4>1</h4>
    </div>
    <div class="item">
      <h4>2</h4>
    </div>
    <div class="item">
      <h4>3</h4>
    </div>
    <div class="item">
      <h4>4</h4>
    </div>
    <div class="item">
      <h4>5</h4>
    </div>
    <div class="item">
      <h4>6</h4>
    </div>
    <div class="item">
      <h4>7</h4>
    </div>
    <div class="item">
      <h4>8</h4>
    </div>
    <div class="item">
      <h4>9</h4>
    </div>
    <div class="item">
      <h4>10</h4>
    </div>
    <div class="item">
      <h4>11</h4>
    </div>
    <div class="item">
      <h4>12</h4>
    </div>
  </div>
</div>

Answer 1

我想当你点击下一步按钮时你想要去下一页。如果我是对的，你可以添加；

slideBy: "page"