在我的主標簽中,我已經為我的幻燈片橫幅實作了影像。
<main id="main-site">
<!-- Owl Carousel code-->
<section id="banner-area">
<div class="owl-carousel owl-theme">
<div class="item">
<img src="./images/banner.png" alt="Banner1">
</div>
<div class="item">
<img src="./images/banner2.png" alt="Banner2">
</div>
</div>
</section>
</main>
我已經在 J??avascript 上初始化了 Owl Carousel。
$(document).ready(function() {
$("#banner-area.owl-carousel").owlCarousel( {
dots: true,
items: 1
});
});
并鏈接了 javascript 和 Owl Carousel jQuery 插件以訪問 javascript 檔案。
<!--Owl Carousel JS-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js"
integrity="sha512-bPs7Ae6pVvhOSiIcyUClR7/q2OAsRiovw4vAkX zJbw3ShAeeqezq50RIIcIURq7Oa20rW2n2q fyXBNcU9lrw=="
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<!--Custom JS-->
<script src="./index.js"></script>
但即使在這一切之后。我的頁面上仍然沒有任何橫幅...有什么問題?
截屏
編輯:我能夠修復它。但我只能在洗掉#banner-area時修復它,但我希望在不洗掉id的情況下修復它。
uj5u.com熱心網友回復:
您應該在此處添加一個空格:
$("#banner-area .owl-carousel").owlCarousel( {
轉載請註明出處,本文鏈接:https://www.uj5u.com/qianduan/350457.html
標籤:javascript html 查询 网络前端 owl-carousel-2
下一篇:失敗的枕頭構建輪
