javascript - Owl Carousel "navText:"不添加箭头

Question

我想在轮播中添加箭头。我已经为我的答案搜索了解决方案，复制了代码，但不知何故它不起作用。

所以，我有这个 HTML:

<div id="owl-demo" class="owl-carousel owl-theme">
        <div class="item">
            <video autoplay muted loop id="myVideo">
            <source src="fleuropdemo.mp4" type="video/mp4">
            </video>
            <div class="video-wrapper">
                <p>FLEUR OP / BEZORGT EEN GOED GEVOEL</p>
                <h2>HET GEVOEL VAN BLOEMEN ANDERS VERTELD</h2>
            </div>
        </div>
   ...2 more .item
</div>

这些是我的 html 中的文件:`owl.carousel.css、owl.theme.default.min.css、owl.carousel.js、jquery.min.js``

这就是我在脚本中所做的:

$(document).ready(function() {

$("#owl-demo").owlCarousel({

 navigation : true, // Show next and prev buttons
 nav: true,
 navText : ["<i class='fa fa-chevron-left'></i>","<i class='fa fa-chevron-right'></i>"],
 loop: true,
 slideSpeed : 300,
 paginationSpeed : 400,

 items : 1, 
 itemsDesktop : false,
 itemsDesktopSmall : false,
 itemsTablet: false,
 itemsMobile : false

});

});

我从这篇文章中获得的 navText 解决方案:How to make a owl carousel with arrows instead of next previous

我想达到的效果完全一样。但不知何故，解决方案对我不起作用......

我还测试了多个代码笔，完全复制了他们的代码。不工作。我开始认为我丢失了文件。我正在使用最新版本的 Owl Carousel 。

轮播的其余部分工作完美。

Answer 1

您的图标没有显示，因为 font awesome 没有正确安装。