我愿意在Jquery的帮助下滑动猫头鹰轮播。这是我的代码,请帮我纠正它。
$('#slide-next').click(function() {
$('#slider').trigger('owl.next');
});
$('#slide-prev').click(function() {
$('#slider').trigger('owl.prev');
});
答案 0 :(得分:0)
正确的事件是:next.owl.carousel and 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>