2017-01-11 5 views
0

Я использую owl-carousel2 для установки плейлиста звука (с контуром: true и center: true), все работает нормально, но я не могу найти документ о своей проблеме :Owl carousel 2 active prev/next navigation on item

Я пытаюсь добавить предыдущую/следующую навигацию по каждому элементу при нажатии. Я хочу, чтобы пользователь мог щелкнуть по элементу по своему выбору, и поэтому он перемещает центр на этот элемент. Он работает с движком мыши, но не на клике.

Есть ли способ сделать это?

есть моя карусель инициализации:

owl.owlCarousel({ 
      loop:true, 
      center: true, 
      margin:3, 
      dot: false, 
      nav: false, 
      items:5, 
      responsive:{ 
       0:{ 
        items:2 
       }, 
       768:{ 
        items:4 
       }, 
       1200:{ 
        items:5 
       }, 
       1500:{ 
        items:4 
       } 
      } 
     }); 

Я попытался это:

owl.on('click', '.item', function (property) { 
      console.log(property); 
      owl.trigger('next.owl.carousel'); 
     }); 

Он работает, но только для следующего пункта, я не нашел, как знать, если это пред нажмите

Спасибо за помощь

+0

вы можете обеспечить скрипку? –

ответ

0

Это тот же самый триггер для предыдущего. Смотрите пример кода:

$(".prev").on('click', function() { 
    owl.trigger('prev.owl.carousel'); 
}); 
0

Я думаю: Ваша цель нажать филин элемент и автоматический прокрутки влево или вправо один пункт.

Если да, то убедитесь, что длина ваших деталей> 1.

И попробуйте ниже код:

owl.on('click', '.item', function (property) { 
     var $currentItem = $(property.target).closest('.owl-item'); 
     var $activeItems = owl.find('.active'); 
     if ($currentItem.index() - $($activeItems[0]).index() <= $activeItems.length/2 - 1) 
     { 
      owl.trigger('prev.owl'); 
     } 
     else if ($($activeItems[$activeItems.length - 1]).index() - $currentItem.index() <= $activeItems.length/2 - 1) 
     { 
      owl.trigger('next.owl'); 
     } 
    }); 
Смежные вопросы