我使用猫头鹰旋转木马2作为滑块 . 响应在窗口调整大小时工作正常,但我需要在更改块容器宽度时调整轮播大小 . (打开侧边栏时容器宽度会发生变化 . )

This is how it looks when sidebar is closed

And this when sidebar is opened

我尝试过使用 responsiveBaseElement

// Initialize news slider
var $owl = $("#news-list").owlCarousel({
    dots: false,
    nav: true,
    navText: false,
    loop: true,
    responsiveBaseElement: ".box-to-check",
    responsive : {
      0: {
          items: 1
      },
      480: {
          items: 2
      },
      768: {
          items: 3
      }
    }
});

我也尝试过使用 refresh.owl.carousel

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

然后我发现刷新猫头鹰旋转木马有一个错误,我试图完全摧毁它并再次构建:

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

$owl.owlCarousel({
  dots: false,
  nav: true,
  navText: false,
  loop: true,
  responsiveBaseElement: ".box-to-check",
  responsive : {
    0: {
        items: 1
    },
    480: {
        items: 2
    },
    768: {
        items: 3
    }
  }
});

部分工作 . 但是当我关闭侧边栏时,它会调整到新的宽度 . (我的意思是我必须打开侧边栏(左上角的BONUS / ACCENT按钮)然后关闭它重新启动滑块 . )你可以看到这里的实例 - ttomoday(点)github(点)io / v / upc /