При работе с Owl Carousel 2 у многих возникают проблемы. В данной статье я собрал частые вопросы, которые связаны с данным плагином, и постараюсь дать четкие ответы на них.
Отобразить Owl Carousel 2 вертикально
Для этого существуют специальные JavaScript свойства:
animateOut : "slideOutUp"
animateIn : "slideInUp"
Однако, нужно понимать, что они относятся только лишь к стрелкам вперед/назад, а прокрутка мышью в любом случае будет происходить влево/вправо.
Owl Carousel 2 перелистывание на несколько слайдов
Стоит обратить внимание на свойство:
slideBy : 1
Оно имеет тип Number, то есть число. По умолчанию перелистывание выполняется по одному слайду.
Owl carousel 2 прокрутка по кругу
В этом вам поможет свойство:
loop : true
Имеет тип Boolean. По умолчанию имеет значение false.
Owl carousel 2 убрать / включить стрелки next prev
Для того, что бы убрать стрелки, необходимо прописать свойство:
nav : false
Имеет тип Boolean. По умолчанию имеет значение true.
Owl carousel 2 включить автопрокрутку или автоматическое переключение
Пропишем в JS свойство:
autoplay : true
Имеет тип Boolean. По умолчанию имеет значение false.
Owl carousel 2 изменить (задать) скорость прокрутки
Скорость прокрутки устанавливается с помощью:
autoplayTimeout : 7000
Свойство имеет тип Number, то есть число в миллисекундах. По умолчанию 5000
Для решения данной задачи, с одной стороны, можно воспользоваться свойством navText:
navText : ['next','prev']
Свойство имеет тип Array (массив), в котором заданы два значения для кнопок вперед и назад соответственно.
С другой стороны, данный вопрос можно решить с помощью CSS и скрыть текст у данных элементов: .owl-prev,
.owl-next {
overflow: hidden;
text-indent: -99px;
}
Owl carousel 2 откуда берется высота
Высота карусели вычисляется исходя из размеров блоков, которые содержаться в ней. Таким образом, если контент одного из блоков больше по высоте, чем остальные, общая высота карусели будет задана именно по нему. Но возможно принудительно задать фиксированную высоту для внутренних блоков через css, через свойство height.
Часто возникает потребность вывести nav (стрелки) и pagination (пагинацию) в Owl Carousel 2, и для многих это оказывается сложным. Что же делать, если стрелки и пагинация не работают, и как включить их у карусели Owl Carousel 2?
Часто возникает необходимость создать две или несколько каруселей на странице сайта. Это достаточно просто сделать с помощью адаптивной карусели Owl Carousel.