У меня проблема с совой каруселью, когда я хочу использовать руль для генерации изображений и получения их источника из JSON.когда я использую руль, сова-карусель дает отключенный класс элементам div, у которых есть owl-dots и owl-nav class, и в моем слайдере не отображаются точки, а моя предыдущая и следующая кнопки не работают.Можно ли использовать руль для совы-карусели?Это мой код.
<section class="grid-container fluid body-blogShow" style="flex-wrap:nowrap">
<div class="grid-container ">
<div class="grid-x">
<div class="cell ">
<div class="grid-x blog_items owl-carousel owl-theme">
<!--****************************-->
<!--html tags generate by handlebars should generate here-->
<!--****************************-->
</script>
</div>
<div class="grid-x ">
</div>
</div>
</div>
</div>
<script id="handlebars-gallery" type="text/x-handlebars-template">
{{#each img}}
<div class="small-12 medium-4 large-2 cell">
<div class="grid-x grid-padding-x">
<div class="cell item">
<a href="">
<div class="img_back blog_one" style="background-
image:url('{{this}}')">
<div class="title">
</div>
</div>
</a>
</div>
</div>
</div>
{{/each}}
</script>
<script type="text/javascript">
$('.owl-carousel').owlCarousel({
loop: true,
margin: 10,
nav: true,
responsive: {
0: {
items: 1
},
600: {
items: 3
},
1000: {
items: 5
}
}
});
//get data from json and generate it by handlebars
var template = $("#handlebars-gallery").html();
var templateScript = Handlebars.compile(template);
$.ajax({
type: "GET",
url: '../../content/Gallery-img/Gallery-img.json',
success: function (data) {
//debugger;
console.log(data);
//console.log(data.length);
var context = data;
var html = templateScript(context);
$(html).prependTo(".blog_items");
//$('.blog_items').append(html);
debugger;
},
error: function (er) {
debugger;
}
});
</script>