Я готов запустить карусель с совами с помощью JQuery. Вот мой код, любезно помогите мне его исправить.
$('#slide-next').click(function() {
$('#slider').trigger('owl.next');
});
$('#slide-prev').click(function() {
$('#slider').trigger('owl.prev');
});
Правильные события: next.owl.carousel и prev.owl.carousel.
$("#slider").owlCarousel();
$('#slide-next').click(function() {
$('#slider').trigger('next.owl.carousel');
});
$('#slide-prev').click(function() {
$('#slider').trigger('prev.owl.carousel');
});
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel = "stylesheet" href = "https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css">
<link rel = "stylesheet" href = "https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.theme.default.min.css">
<script src = "https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js"></script>
<button id = "slide-next">Next</button>
<button id = "slide-prev">Prev</button>
<div id = "slider" class = "owl-carousel">
<div> Your Content1 </div>
<div> Your Content2 </div>
<div> Your Content3 </div>
<div> Your Content4 </div>
<div> Your Content5 </div>
<div> Your Content6 </div>
<div> Your Content7 </div>
</div>
Возможный дубликат jQuery кнопки "следующая" и "предыдущая"