Question

我正在寻找更具体的设置后更改owl carousel 2选项。

我正在寻找一种方法来禁用拖动元素的父元素，如下所示：

$('#carousel').on('drag.owl.carousel', function(event) {

    $('.carousel').on('drag.owl.carousel', function(event) {
        //disable drag
    })    
})

$('#carousel').on('dragged.owl.carousel', function(event) {

    $('.carousel').on('dragged.owl.carousel', function(event) {
         //enable drag
    })
})

Answer 1

以上任何解决方案都不适用于猫头鹰旋转木马2.2。我想在init上更改stagePadding并调整事件大小。

我的解决方案：

    var owl = $('.page-item-gal');   
    owl.owlCarousel({
        ...
        onResized : setStagePaddingOC,
    });
    function setStagePaddingOC()
    {
      var carousel = owl.data('owl.carousel');
      var StgPad = ($( window ).width() - owl.parent().parent().find('.width-helper').width()) / 2;
      carousel.settings.stagePadding = StgPad;
      carousel.options.stagePadding = StgPad;
      owl.trigger('refresh.owl.carousel');
    }    
    setStagePaddingOC(); // onInitialized doesn't work

Answer 2

看起来Owl 2.0的API是移动目标，因此调用可能取决于您所使用的版本。对我而言：

TextBox

但是对你来说可能是这样的：

$('.carousel').trigger('changeOption.owl.carousel', {
  mouseDrag: false,
  touchDrag: false,
  pullDrag: false
});

或者

$('.carousel').trigger('change', { property: { name: 'mouseDrag', value: false } });

所以它们可能看起来像：

$('.carousel').trigger('change.owl.carousel', {
  mouseDrag: false,
  touchDrag: false,
  pullDrag: false
});

Answer 3

不要尝试通过挂钩拖动事件来禁用拖动，而是使用owl.reinit()函数以及touchDrag和mouseDrag选项。例如，如果你有一个轮播#carousel：

var $carousel = $('#carousel');
var owl = $carousel.data('owlCarousel'); # Your DOM element gets an 'owlCarousel' data property containing the Owl object. 
owl.reinit({touchDrag: false, mouseDrag: false;});

虽然该方法名为reinit，但它不会删除任何先前设置的选项。

Answer 4

owl.trigger('refresh.owl.carousel');

重新初始化和更新的最佳选项

Answer 5

是猫头鹰旋转木马版本2 ..

这适合我（直接访问选项）

    var $carousel = $('#carousel');
    var owl = $carousel.data('owlCarousel');  

    w = $( window ).width();
    var animateStyle = 'fadeOut';
    if(w <= 768){
        animateStyle = false;
    } 
    owl.options.animateOut = animateStyle;

Answer 6

上面的答案对我没有用，但这确实有用：

var $carousel = jQuery('#owl-carousel-block');
var carouselData = $carousel.data();
var carouselOptions = carouselData['owl.carousel'].options;
    carouselOptions.loop = true;
$carousel.trigger('refresh.owl.carousel');

设置后更改owl carousel 2选项？

6 个答案: