//banner slider
var BannerSlider = $('.banner_three_slider');
BannerSlider.owlCarousel({
items: 1,
loop: true,
smartspeed: 2000,
animateIn: 'fadeIn',
animateOut: 'fadeOut',
autoplay: true,
dots: true,
autoplayTimeout:7000,
autoplayHoverPause: true,
navText: ["<i class='fa fa-angle-left'></i>", "<i class='fa fa-angle-right'></i>"],
responsive: {
300: {
autoplay: true
},
768: {
autoplay: true
}
}
});
嗨,大家好,我正在一个项目上,我必须添加一个猫头鹰轮播,但是即使我给了点,它还是不可见:true命令我对javascript的了解是有限的,任何人都可以帮助我在上面的代码中找到错误
答案 0 :(得分:0)
$(document).ready(function() {
$('.owl-carousel').owlCarousel({
items: 1,
loop: true,
smartspeed: 2000,
animateIn: 'fadeIn',
animateOut: 'fadeOut',
autoplay: true,
dots: true,
autoplayTimeout:7000,
autoplayHoverPause: true,
navText: ["<i class='fa fa-angle-left'></i>", "<i class='fa fa-angle-right'></i>"],
responsive: {
300: {
autoplay: true
},
768: {
autoplay: true
}
}
})
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.theme.default.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css" rel="stylesheet"/>
<div class="owl-carousel owl-theme">
<div class="item">
<h4>1</h4>
</div>
<div class="item">
<h4>2</h4>
</div>
<div class="item">
<h4>3</h4>
</div>
<div class="item">
<h4>4</h4>
</div>
<div class="item">
<h4>5</h4>
</div>
<div class="item">
<h4>6</h4>
</div>
<div class="item">
<h4>7</h4>
</div>
<div class="item">
<h4>8</h4>
</div>
<div class="item">
<h4>9</h4>
</div>
<div class="item">
<h4>10</h4>
</div>
<div class="item">
<h4>11</h4>
</div>
<div class="item">
<h4>12</h4>
</div>
</div>