javascript - 如何重新启动 Owl Carousel 2.0？

我知道在第一个版本的猫头鹰轮播中，我们是这样进行的:

var $carousel = $('#carousel');
var owl = $carousel.data('owlCarousel');
owl.reinit({touchDrag: false, mouseDrag: false;});

好的，但是在第二版中我们该怎么做，我不知道他们是如何重命名的。

最佳答案

由于某些原因， $('＃your_carousel')。trigger('destroy.owl.carousel')无法正常工作。它不会删除再次重新启动插件所需的所有类。

您需要将其完全删除，以销毁“猫头鹰传送带2”。就像在github上的本期文章中所述:https://github.com/smashingboxes/OwlCarousel2/issues/460

要销毁猫头鹰函数，请使用:

$('#your_carousel').trigger('destroy.owl.carousel').removeClass('owl-carousel owl-loaded');
$('#your_carousel').find('.owl-stage-outer').children().unwrap();

这对我来说很完美:

// find element
$owl = $('body').find('#your_carousel');

// set the owl-carousel otions
var carousel_Settings = {
  touchDrag: false,
  mouseDrag: false
};

function initialize(){
  var containerWidth = $('body').find('.navbar').outerWidth();
  if(containerWidth <= 767) {
    // initialize owl-carousel if window screensize is less the 767px
    $owl.owlCarousel( carousel_Settings );
  } else {
    // destroy owl-carousel and remove all depending classes if window screensize is bigger then 767px
    $owl.trigger('destroy.owl.carousel').removeClass('owl-carousel owl-loaded');
    $owl.find('.owl-stage-outer').children().unwrap();
  }
}

// initilize after window resize
var id;
$(window).resize( function() {
  clearTimeout(id);
  id = setTimeout(initialize, 500);
});

// initilize onload
initialize();

关于javascript - 如何重新启动 Owl Carousel 2.0？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/25339836/