Owl 轮播实现

Question

我无法使用我想使用的 Owl Carousel 2。我认为这与我连接到 html 的文件有关，但可能还有另一个问题。我有正确的文件吗？

到目前为止，这是我的 HTML。我已经检查了其他文件的链接，它们都是正确的。

<!DOCTYPE html>
<html>

<head>

    <link rel="icon" href="img/favicon.png" type="image/gif" sizes="16x16">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>Mockup</title>

    <!-- Bootstrap Core CSS -->
    <link href="css/bootstrap.min.css" rel="stylesheet">

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

</head>
<body>
<header>
</header>

<div class="owl-carousel">
    <div class="item"><h4>1</h4></div>
    <div class="item"><h4>2</h4></div>
    <div class="item"><h4>3</h4></div>
    <div class="item"><h4>4</h4></div>
    <div class="item"><h4>5</h4></div>
    <div class="item"><h4>6</h4></div>
    <div class="item"><h4>7</h4></div>
    <div class="item"><h4>8</h4></div>
    <div class="item"><h4>9</h4></div>
    <div class="item"><h4>10</h4></div>
    <div class="item"><h4>11</h4></div>
    <div class="item"><h4>12</h4></div>
</div>


    <footer> 
        <script src="js/plugin/owl.carousel.min.js"></script>
        <script src="js/custom.js"></script>
    </footer>
</body>
</html>

希望你能帮助我。

Answer 1

您忘记加载 jQuery!

尝试：

<footer> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    <script src="js/plugin/owl.carousel.min.js"></script>
    <script src="js/custom.js"></script>
</footer>

Owl 轮播实现

Owl Carousel implementation

javascript

jquery

twitter-bootstrap

owl-carousel