【问题标题】:Owl carousel is getting display none猫头鹰旋转木马没有显示
【发布时间】:2023-12-31 14:02:01
【问题描述】:

我使用过 owl-carousel,但它不起作用。当我检查浏览器时发现 .owl-carousel div 显示 display:none。很快它就开始工作并更改为无显示。 我使用了code-pen https://codepen.io/niloydeysarkar/pen/MxZdeE的轮播@

我复制了与给定相同的代码。我检查了 owl.carousel.min.css 和 owl.theme.default.min.css 以及 head section bootstrap 4 css。

<link rel="stylesheet" href="css/owl.carousel.min.css">
<link rel="stylesheet" href="css/owl.theme.default.min.css">

还有 jquery 和 owl.carousel.min.js 和 bootstrap.min.js

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="js/owl.carousel.min.js"></script>
<script src="js/function.js"></script>

我刚刚复制并粘贴的所有 css、js 代码。 我应该包含我粘贴的完整代码吗?

【问题讨论】:

    标签: owl-carousel


    【解决方案1】:

    请尝试这些

    CSS 插件

    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.theme.default.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.0/animate.min.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/css/bootstrap.min.css">
    

    jQuery 和 JS

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
    <script src="js/function.js"></script>
    

    【讨论】:

    • Bootstrap 4、动画 css 和 bootstrap 4 js 也包括在以前的版本中。我没有提到这个。