owlCarousel не вычисляет высоту в аккордеоне на странице resize

Question

Я использую owlCarousel внутри аккордеона. Все прекрасно, пока я не изменю размер окна.

После изменения размера, если аккордеон был уже открыт, он выглядит идеально, но если он был закрыт во время изменения размеров высоты карусельной идет к 0.

Я пытался использовать .refres() метод совы каруселью, но это не сработало.

Answer 1

Я нашел решение here.

Решение было дано ses & импровизированного по tofumedia

Как SES цитировали:

OWL старт для JS аккордеона, и нужно изменения размера обновить

JS:

$('.owl-carousel').owlCarousel({ 
    margin: 0, 
    responsiveClass: true, 
    nav: false, 
    dots: true, 
    items: 1, 
    responsive: { 
     0: { 
      items: 1 
     }, 
     600: { 
      items: 1 
     }, 
     1000: { 
      items: 1 
     } 
    } 
}); 

$("#accordion").accordion({ 
    heightStyle: "content", 
    header: ".accordionHeadline", 
    collapsible: true, 
    active: 0, 
    beforeActivate: function (event, ui) { 
     window.dispatchEvent(new Event('resize')); 
    } 
}); 

Или более надежное решение, поддерживающее IE:

$("a[data-toggle='tab']").on('shown', function() { 
    var evt = document.createEvent('UIEvents'); 
    evt.initUIEvent('resize', true, false,window,0); 
    window.dispatchEvent(evt); 
});