5

Как можно сверстать блок с такой анимацией?
Creativo Arquitectos Web Interactions
(показала подруга-дизайнер, просто интересно).
Интересует, собственно, фон, а не надписи. Мне в голову не приходит ничего, кроме фонового gif или видео, ну или может можно как-то через svg исхитриться.

4
  • 1
    Посмотрите фильтры в css 18 июл 2018 в 7:22
  • @Sergey Glazirin Фильтры такого не сделают)
    – Heidel
    18 июл 2018 в 7:23
  • 2
    А что если сделать три картинки, формата png и через css накидывать фильтр "hue-rotate". 18 июл 2018 в 10:07
  • Самая простая реализация - использование слайдера с тремя разными по цветам картинками и таким же эффектом.
    – De.Minov
    22 дек 2018 в 19:31

3 ответа 3

1

На мой взгляд тут три разных изображения, смена между ними происходит через css свойства mask, где сама маска задается анимированным svg файлом.

0

На этом сайте используется фоновый .gif, я считаю, что вам в голову приходят здравые мысли (о фоновых .gif или видео) screenshot

0
-2

Это пустой блок с фоном из этой анимации: https://cdn.dribbble.com/users/418188/screenshots/4836269/creativo_arquitectos_web_interactions.gif так что тут нечего и верстать.

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.