Как реализовать такого плана слайдер?

Question

[Gyusss]

Здравствуйте, выполняю первый проект по вёрстке, и заказчик попросил реализовать слайдер, как в примере.

В js не силён, пока только html, css.
По коду смотрел не могу понять что отвечает на слайдеры, может есть кто может помочь?
Тут слева будет просто картинка, нужна только анимация, может можно как то привязать к слайдеру слик?
В активном слайде что бы было видно и картинку и текст справа. а в остальных просто картинки и при смене слайда текст выезжает или заезжает под картинку?

Comments

[Gyusss]

Может есть возможность на свайпере так же реализовать

[Антон Литвиненко]

А заказчик понимает, что верстка такого уровня как в примере это уровень далеко не начинающего верстальщика?
А слайдер там походу самодельный

[Gyusss]

Антон Литвиненко, Возможно, можно реализовать именно анимацию выезда и заезда блоков?

[Антон Литвиненко]

Gyusss, это как раз несложно, на все слайды делаем смещение, например через трансформ, а на активный с небольшой задержкой пишем стили нормального положения

[Gyusss]

Антон Литвиненко, И выйдет что при смене слайда слева текст выедет быстрее, если справа, то медленнее, верно?

[Gyusss]

Антон Литвиненко, Вот к примеру такого вида, мне надо сделать слайдер.
Выходит, когда активный виден текст, вот надо что б инфо просто выезжало, что пожно реализовать, через трансформ?

[Антон Литвиненко]

Gyusss, делайте песочницу и будем смотреть. я так на слух не понимаю

[Gyusss]

Антон Литвиненко, Cейчас создам

[Gyusss]

Антон Литвиненко, https://jsfiddle.net/testerr1212/t0Lesh2j/ Вот как то можно сделать вот на таком примере анимацию выезда блок с описанием.
Слева слайдер будет закрыт плашкой, то slick-list будет виден только справа, не выходит сделать такой же плавный заезд - выезд как на сайте примере https://barkligallery.ru/, может можно реализовать не сликом а каким то другим слайдером?

[Gyusss]

Gyusss, Реализовал, как смог показ следующего слайда с выездом плавным слева, но вот показ прошлого слайда не выходит реализовать, может сможете помочь с этим?

[Антон Литвиненко]

Gyusss, Для того чтобы сделать так как в задаче, нужно посидеть покумекать. Я ваше чуть переделал, но в фидле конечно не шибко удобно
https://jsfiddle.net/fxdn47kq/

Answer 1

[RAX7]