Как сделать такой движущий объект с помощью CSS?

Question

[derekee]

Привет всем!

Пытаюсь реализовать такие-же облачка как на этом сайте в первом блоке https://www.xeovo.com
Украсть не получилось, по этому пытаюсь найти статью примерную где описывают как сделать такое.
Самое интересное что даже на мобильных всё нормально отображает, старые наброски не буду показывать ибо там ужас.
Буду очень признателен если поможете.

Comments

[OVK2015]

https://codepen.io/jonathan/pen/YyMKMz
Ваш вариант на порядок проще

[derekee]

OVK2015: Спасибо!

[OVK2015]

derekee: Не за что у greenSock.js большое будущее, если бы не их жадность

[Нерон Лордов]

derekee дизайнер я, не разработчик)

Answer 1

[Alex]

css анимация

@-webkit-keyframes fadeInDownBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

Comments

[derekee]

Спасибо! Буду пробовать реализовать так-же.