Ниже мой код для очень простой совы карусели. Он предназначен для отображения только одного изображения/слайда в любой момент времени, но в тот момент, когда я заканчиваю стек всех этих изображений в одном слайде. Я уверен, что я должен делать что-то очень явно неправильное.Сова карусели Слайды всех визуализаций как один уложенный блок
<ul class="showcasecarousel">
<li class="item"><img src="img/trackback.png" alt="Some text here"></li>
<li class="item"><img src="img/trackback.png" alt="Some text here"></li>
<li class="item"><img src="img/trackback.png" alt="Some text here"></li>
</ul>
JavaScript в нижней части моего HTML файла:
$('.showcasecarousel').owlCarousel({
navigation : false, // Show next and prev buttons
slideSpeed : 300,
paginationSpeed : 400,
singleItem: true,
loop: true,
});
И, наконец, CSS у меня есть:
.showcasecarousel .item img{
display: inline;
width: 100%;
height: auto;
}
Оба CSS и файлы JS для Совы Карусель и JavaScript тоже были правильно включены - на одной странице есть другие карусели, и они отлично работают. Любая помощь будет принята с благодарностью.
Когда я проверяю его на Chrome, они отображаются как три разных div, но все они являются классом «owl-item active». Я полагаю, что должен быть только один из этих класс? – fierynot
Не могли бы вы создать jsfiddle? –
Я пытался, но я не был уверен, как загрузить OwlCarousel в него – fierynot