Как реализовать карусель под разные разрешения (owl carousel)?

Question

[Bobull]

Как можно реализовать карусель под разные девайсы (разные расрешения ) с помощью owl carousel (или друой карусели. Важно что бы работало на планшете, телефоне) в таком виде:
Расширение экрана с 1280 (отображает 3х3 итема на странице)


Расширение экрана с 800 по 1280 (отображает 2х2 итема на странице)


Расширение экрана с 450 по 800 (отображает один итем)

Answer 1

[Ankhena]

owlcarousel.owlgraphic.com/demos/responsive.html
Выбрать значения 9, 4 и 1 для нужных размеров.
И немножко допилить стили, чтобы было несколько строк.

Comments

[Bobull]

"И немножко допилить стили, чтобы было несколько строк. "
Вот...это интересно. Если можно поподробней. Спасибо.

[Ankhena]

Bobull: Это было предположение.

Я бы действовала так:
Контейнеру flex, wrap, высоту нужную.
Деткам ширину в %. НО, возможно, не удалось бы перебить, то что скрипт инлайново дописывает. И тогда пришлось бы в JS еще намудрить им расчет ширины.

Еще вариант пришедший в голову:
Значения в карусели ставить как обычно, 3,2,1. А с помощью JS в зависимости от размера окна нужно количество итемов оборачивать в div'ы по столбцам.
Так даже правильнее, наверное, будет.

Answer 2

[Bobull]

Не совсем решение для меня. Но можно использовать такой метод: jsfiddle.net/Owl/TWtwt
Может кому-то пригодится.