Как реализовать анимацию для галерее?

Question

[Smio]

Пример какая нужна анимация
https://www.youtube.com/watch?v=ZaDWGSb1Xvo&featur...
на видео не видно курсора,
Попытался реализовать через hover но не понимаю как сделать когда на среднем изображение
и нужно плавное появление слева и с справа.
https://codepen.io/smio/pen/ExgJXrd

Возможно есть примеры или как такую ​​анимацию загуглить

Answer 1

[RAX7]

Comments

[Smio]

Очень красиво, но не совсем то, что нужно.

[RAX7]

Smio, это же не стол заказов, допилить под себя самому будет не сложно.

[Smio]

RAX7, я понимаю, я же оценил, если не будет больше вариантов у людей отмечу как решение.
Спасибо.

Answer 2

[Александр Варлаков]

Несколько раз пересмотрел видео и мне кажется там используется несколько слоев - самый верхний с 4 блоками. При наведении на блок просто z-index меняется. Смена z-index анимируется

Comments

[Smio]

Просидел несколько часов со слоями, все варианты перепробовал, но никак не получается ...

[Александр Варлаков]

А что не получается, покоретнее? Подробнее, может я попробую написать я чего

[Smio]

Для того чтобы сделать слои нужно совать каждое изображение на 25% вправо, а анимация должна срабатывать без смещения элемента. Получается, для 3 элемента, нужно будет выставлять -50% в лево чтобы изображение получило 100% ширины.
Или я не очень понимаю как сделать эти слои и чтобы там срабатывала анимация.
И нет понимания как для части изображения выставить z-index/