@mydarck

Как сверстать карусель?

Есть такой элемент шаблона:
b328c35ec0b14360836cfbde04ee2b75.jpg
Это карусель с увеличивающимся центральным блоком.
Основные задачи:
  • Сделать отступы одинаковыми независимо от размера блока;
  • В данной карусели не предусмотрены ни prev/next стрелки, ни 'dots' переключатели. По этому листать его можно только перетаскиванием правого/левого блока в цент.

На первый взгляд мне показался подходящим Slick.js, тем более, что у него уже из 'коробки' есть центрирующий мод.
Какие с ним возникли трудности:
  • Центральный блок увеличивается за счет transform scale, который получает в качестве значения относительные величины, а не точные. В результате у центрального блока присутствует погрешность, пусть и не значительная.
  • Отступы не пересчитываются в зависимости от центрального блока, а компенсируются. Т.е. между блоками находящимися слева и справа от центра отступы меньше, чем между остальными.

Если есть идеи или более подходящий скрипт карусели, подскажите пожалуйста.
Если хотите или нужны примеры моих попыток, напишите, я выложу их в комментариях.
  • Вопрос задан
  • 846 просмотров
Пригласить эксперта
Ответы на вопрос 3
webirus
@webirus
Тыжверстальщик! Наверстай мне упущенное...
kenwheeler.github.io/slick
Center Mode
arrows: false
controls: false
И совсем не понимаю, чем он тебя не устраивает.
Но судя по описанию, ты просто не так его готовишь.
Решается через переопределение CSS.
Ответ написан
@nugget-ekb
Верстальщик
удобство данной карусели под большим вопросом! я для карусели всегда использую owl-карусель. для всех моих задач она всегда подходила.
Ответ написан
Krasnodar_etc
@Krasnodar_etc
little front
Центральный блок увеличивается за счет transform scale, который получает в качестве значения относительные величины, а не точные. В результате у центрального блока присутствует погрешность, пусть и не значительная.

- Своим css добавь блоку .slick-center любые необходимые стили
Отступы не пересчитываются в зависимости от центрального блока, а компенсируются. Т.е. между блоками находящимися слева и справа от центра отступы меньше, чем между остальными.

- Так ты ж сам в стилях их хоть margin-ами в пикселях можешь сделать)

Слик хорош тем, что довольно просто кастомизируется/поправляется обычным css. И не надо даже лезть в файлы плагина)
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы