CODEWITHSUNDEEP
javascriptjqueryowl-carousel
hyenax
hyenax

Reputation: 157

Owl Carousel "navText:" doesn't add arrows

I want to add arrows to my carousel. I've searched for solutions for my answer, copied the code, but somehow it did not work.

So, I've this 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>

These are the files I have in my html: `owl.carousel.css, owl.theme.default.min.css, owl.carousel.js, jquery.min.js``

And this is what I'm doing in my script:

$(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

});

});

The navText solution I have from this post: How to make a owl carousel with arrows instead of next previous

What I want to achieve is exactly the same. But somehow the solution doesn't work for me...

I've also tested multiple codepens, exactly copied their code. Did not work. I'm starting to think I'm missing files. I'm using the latest version for owl carousel.

The rest of the carousel works perfectly.

Upvotes: 1

Views: 3167

Answers (1)

MatejG
MatejG

Reputation: 1423

Your icon's are not displaying because font awesome isn't correctly installed.

Upvotes: 1

Related Questions