Hello everyone, there is a dress up website. As soon as you get to the carousel (owl carousel), the website hangs on the hook and does not react to anything. Over time, it starts to work as it should. In the console, no errors are displayed. What could be the problem?
$('.item').magnificPopup({ type: 'image', closeOnContentClick: true, mainClass: 'mfp-img-mobile', image: { verticalFit: true } }); $('.next').click(function() { owl.trigger('next.owl.carousel'); }) $('.prev').click(function() { owl.trigger('prev.owl.carousel', [300]); }) <div class="owl-carousel"> <a href='img/work/1.jpg' class="item"> <img src="img/work/1.jpg" alt=""> </a> <a href='img/work/2.jpg' class="item"> <img src="img/work/2.jpg" alt=""> </a> <a href='img/work/3.jpg' class="item"> <img src="img/work/3.jpg" alt=""> </a> <a href='img/work/4.jpg' class="item"> <img src="img/work/4.jpg" alt=""> </a> <a href='img/work/5.jpg' class="item"> <img src="img/work/5.jpg" alt=""> </a> <a href='img/work/6.jpg' class="item"> <img src="img/work/6.jpg" alt=""> </a> <a href='img/work/7.jpg' class="item"> <img src="img/work/7.jpg" alt=""> </a> <a href='img/work/8.jpg' class="item"> <img src="img/work/8.jpg" alt=""> </a> <a href='img/work/9.jpg' class="item"> <img src="img/work/9.jpg" alt=""> </a> </div> <div class="controlls"> <div class="prev"></div> <div class="next"></div> </div> </div>
owl,jqueryandmagnificPopup- this is what at first glance is not enough - Grundy