在Owl Carousel 2中打开/关闭mouseDrag

时间:2018-06-13 13:29:38

标签: owl-carousel-2

我一直在尝试各种方法在Owl Carousel 2中切换拖动功能而没有太大的成功。 基本上,我有一个带缩放功能的旋转木马,但如果你在缩放时按住鼠标,你可以滑过旋转木马的其余部分。

以下代码是我目前所拥有的。它工作得很好 - 包括将Owl中的导航更改为false,但它似乎不想更改Drag选项。关于我哪里出错的任何建议? 并且在这里为任何可怜的编码提前道歉 - 它是从各种教程和答案拼凑而成的! 谢谢 编

var $easyzoom = $('.easyzoom').easyZoom();



$easyzoom.each(function(i) {
  $easyzoom.eq(i).data("easyZoom").teardown();

});

        $('.toggle').on('click', function() {
         var activeImg = $('div.owl-item.active').children('.easyzoom--with-toggle');

            var $this = $(this);
          var api2 = $easyzoom.filter(activeImg).data('easyZoom');


            icon = $(this).find("i");
            if ($this.data("active") === true) {

                $this.data("active", false);
                icon.toggleClass("fa fa-search-minus fa fa-search-plus");
             $('.owl-carousel').data('owl.carousel').options.nav = true; 
             $('.owl-carousel').data('owl.carousel').options.mouseDrag = true;
              $('.owl-carousel').data('owl.carousel').options.touchDrag = true;
              $('.owl-carousel').data('owl.carousel').options.pullDrag = true;
$('.owl-carousel').trigger( 'refresh.owl.carousel' );


                api2.teardown();
            } else {

                $this.data("active", true);
              icon.toggleClass("fa fa-search-plus fa fa-search-minus");
             $('.owl-carousel').data('owl.carousel').options.nav = false; 
             $('.owl-carousel').data('owl.carousel').options.mouseDrag = false;
              $('.owl-carousel').data('owl.carousel').options.touchDrag = false;
              $('.owl-carousel').data('owl.carousel').options.pullDrag = false;
$('.owl-carousel').trigger( 'refresh.owl.carousel' );
                api2._init();
            }
        });

0 个答案:

没有答案