Слайд OwlCarousel 2, не работает с сенсорным и мышиным перетаскиванием - PullRequest
Новая
       26

Слайд OwlCarousel 2, не работает с сенсорным и мышиным перетаскиванием

0 голосов
/ 12 января 2019

Я использую OwlCarousel 2.3.4 и хочу использовать опцию slideBy для перемещения элементов на 2, но это будущее работает только с точками или навигацией, а не с перемещением или перетаскиванием мышью. Я пытаюсь добиться того, чтобы при касании или перетаскивании перемещать карусель на 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>
...