Why might owl carousel not work?

Question

css

Hello!
Why might owl carousel not work? In the head I include the owl carousel style like this:

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.2.1/assets/owl.carousel.min.css" integrity="sha256-AWqwvQ3kg5aA5KcXpX25sYKowsX97sTCTbeo33Yfyk0=" crossorigin="anonymous" />

Below, before the closing body tag, I include javascript:

<script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.2.1/owl.carousel.min.js" integrity="sha256-s5TTOyp+xlSmsDfr/aZhg0Gz+JejYr5iTJI8JxG1SkM=" crossorigin="anonymous"></script>

But when I add the owl-carousel class to the HTML elements, the element just disappears. At the same time, there are no JS errors in the console. What could be the problem?

Answer 1

did you initialize the carousel plugin itself?
tavo type:

$(document).ready(function(){
  $(".owl-carousel").owlCarousel();
});

Answer 2

Are there any errors in the console? jquery connected? 1 time connected? Is it connected after owl? And 3000 more questions, but it's easier if you give a link or errors from the console.

Answer 3

If I'm not mistaken, then in the head of the site you need to add something like this:

<style type="text/css">
        #slider, .slide {height: 300px; width: 100%;}
    </style>

If these styles are not present, then in my case the height of the block was equal to zero. Maybe that's the issue?

Answer 4

Possibly due to

integrity="sha256-s5TTOyp+xlSmsDfr/aZhg0Gz+JejYr5iTJI8JxG1SkM=" crossorigin="anonymous"