Как привязать текстовое поле для Owl carousel

Question

Создал много каруселей с навигацией. Однако, не получается по нажатию на enter выбрать то значение в карусели какое нужно. Вот фрагмент, который работает, но номер страницы прячется в скрытой части карусели вместо того, что бы быть по центру.

$('.form__input').on( 'change', function(e) {
        e.preventDefault(); 
        secondary.trigger('to.owl.carousel', $(this).val());
      });

secondary - сама карусель. есть ещё и primary, которую я привязал на клик, однако она вообще стоит, потому что нету команды от текстового поля. Как сделать выбор номера страницы да ещё и с кликом по ней в голову не приходит.

<div class="form">
        <input type="text" class="form__input" placeholder="">
      </div>
        <div class="pagination">
          <div class="owl-carousel owl-pagination multiCarosel">
              <li class="item"> <a href="#">1</a></li>
              <li class="item"> <a href="#">2</a></li>
              <li class="item"> <a href="#">3</a></li>
              <li class="item"> <a href="#">4</a></li>
              <li class="item"> <a href="#">5</a></li>
              <li class="item"> <a href="#">6</a></li>
              <li class="item"> <a href="#">7</a></li>
              <li class="item"> <a href="#">8</a></li>
              <li class="item"> <a href="#">9</a></li>
          </div>
        </div>

Answer 1

Сам разобрался. Если кому-то вдруг нужно будет, то выкладываю код:

// Текстовое поле для пагинации по карусели 
$('.form__input').on( 'change', function() { 
  var slide = parseInt($(this).val()) || 1; 
secondary.trigger('to.owl.carousel', slide - 4); 
});

Число 4 это значит на сколько сдвинется к центру номер пагинации от левой стороны. Если Items 2, то 4 , ясное дело, не подойдет. И ещё чтобы работало нужно в настройках Owl-carousel поставить loop: true. Без этого может ничего не работать.

БЛОГ НА HUSL

Как привязать текстовое поле для Owl carousel

Ответы (1 шт):