1

我几乎完成了创建一个整洁的用户个人资料页面，用户可以在其中观看他们的个人资料。我正在使用集成在 Wordpress 中的 Bootstrap 框架。我使用Bootstrap 的选项卡来获取大量信息，但要让用户清楚。我有两个主要选项卡，称为“AWF I”和“AWF II”，在这些选项卡中，我有有关基金的信息，还有一个用于显示图片的 Owl Carousel AWF I 选项卡在此处处于活动状态 正如您所见，轮播效果很好，但是当我激活选项卡“AWF”时II" 我明白了： AWF II 选项卡在此处处于活动状态 如您所见，图片/轮播本身非常小，我不知道如何克服这一点，轮播应该像“AWF I”选项卡中的那样显示。这里有一个线索，可能会让你们知道为什么会发生这种情况：当我右键单击并检查 Google Chrome 中的元素时，轮播会弹出到正确的大小，就像它应该的那样： 正确的显示应该是这样的 但是当我切换回“AWF I”时之后，那个轮播显示小图像，所以基本上，用谷歌浏览器检查会让他们切换角色。

对此有任何线索吗？如果您需要更多信息，请告诉我！谢谢！

更新 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
        }
    }
});

});
4

1 回答 1

2

@Jason Anello，www.teamtreehouse.com 上的一个模组通过建议从 Owl Carousel 2 切换到较旧但更稳定的 Owl Carousel 1 解决了这个问题！我将我的 css 和 js 文件从版本 2 更改为版本 1，现在轮播加载正常！谢谢杰森！！

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

于 2014-10-13T19:50:21.623 回答