Owl Carousel问题与Bootstrap选项卡

Question

我几乎完成了创建一个整洁的用户个人资料页面，用户可以在其中查看他们的个人资料。我正在使用集成在Wordpress中的Bootstrap框架。我正在使用Bootstrap's Tabs来获取大量信息，但要为用户保持清晰。 我有两个主要选项卡，称为“AWF I”和“AWF II”，在这些选项卡中我有关于基金的信息，以及猫头鹰轮播显示图片 你可以看到旋转木马工作得很好，但是当我激活标签“AWF II”时，我得到了这个： 如您所见，图片/轮播本身非常小，我不知道如何克服这个问题，轮播应该像“AWF I”标签中那样显示。 这是一个线索，可能会让你们知道为什么会发生这种情况：当我右键点击并检查谷歌浏览器中的元素时，轮播将弹出正确的大小，如下所示： 但当我切换回“AWF I”之后，该旋转木马会显示小图片，所以基本上，使用Google Chrome进行检查会让他们切换角色。

有什么线索吗？如果您需要更多信息，请告诉我！谢谢！

更新01

以下是我用来调用轮播的代码：

$(document).ready(function(){

$("#owl-awf1-properties,#owl-awf2-properties").owlCarousel({
    pagination: true,
    loop: true,
    dots: false,
    autoplay: true,
    autoplayTimeout:2000,
    autoplayHoverPause:true,
    margin:10,
    responsiveClass:true,
    responsive:{
        0:  {
            items:2
        },
        450:{
            items:3
        },
        767:{
            items:4
        },
        991:{
            items:5
        },
        1199:{
            items:5
        }
    }
});

});

Answer 1

@Jason Anello ，www.teamtreehouse.com的一个mod解决了这个问题，建议从Owl Carousel 2切换到更老但更稳定的Owl Carousel 1！我将我的css和js文件从版本2更改为版本1，现在轮播加载就像他们应该的那样！谢谢Jason !!

感谢克里斯蒂娜试图提供帮助！