Какой из известных вам слайдеров может масштабировать картинку при клике на нее?

Question

[Сергей Бурдужа]

Нужен слайдер такого типа


При клике на картинке, он немного масштабируется.
Я подключил плагин slick.js, но не мог добиться такого эффекта.

Comments

[Евгений]

в активные слайды добавляется класс active вот для этого слайда добавьте например scale(1.1)

[Сергей Бурдужа]

Евгений, сейчас попробую

[Сергей Бурдужа]

Евгений, Масштабируется только по-горизонтали. Тут нужен другой подход.

Answer 1

[inkShio]

У слик слайдера есть такие опции
centerMode: true,
centerPadding: '60px',

На офф сайте есть даже в примерах.

Comments

[Сергей Бурдужа]

Это я и сам знаю.
Мне нежно поведение как на скриншоте

[Сергей Бурдужа]

Я сделал как на оф сайте
слайдер слайдер из блока наши проекты

Если вы не заметили, на макете нет падингов. А в slick.js уменьшается картинка за счет падингов.

[inkShio]

Сергей Бурдужа, Пример, Все это делается либо centerMode, либо как выше писали активному слайду scale(1.1). Но может быть потребуется немного стандартные стили переписать, каждый случай разный.

[Сергей Бурдужа]

inkShio,
Вот ссылка на сайт webforworld
В конце, блок "Наши проекты".
Вот, что получилось использую center mode.
Этот эффект устроен так, что для всех картинок устанавливается уменьшение, а у той, что по центру, размер по-умолчанию. Отсюда и расстояние между картинок.
Понимаете?

А мне нужно, чтобы как на макете, картинки слитно были.
А scale(1,1) не работает. Картинка не может увеличиваться больше чем контейнер слайдера.

Думаю, нужен другой плагин.
Я целый день с ним помучался.