Как воспроизвести анимацию на css?

Question

[Иван Симонов]

Здравствуйте
Есть код

Пытаюсь воспроизвести анимацию, которая создана с использованием javаscript (черный блок)
Синий блок - это мои попытки
Подскажите, возможно ли так сделать?

Answer 1

[historydev]

Привет юный любитель знаний, вот держи.

P.S. Играйся с задержкой, пока не придёшь к нужному тебе результату.

Comments

[historydev]

С этим играй

.block-css #eedmm75rbkz78 { /* #1 */
  
    animation-delay: 0.3s;
  
}

.block-css #eedmm75rbkz711{ /* #2 */
  
    animation-delay: 0.5s;
    
}

.block-css #eedmm75rbkz72{ /* #3 */
  
    animation-delay: 0.7s;
    
}

[Stalker_RED]

Владимир, а ничего, что полоски не синхронизированы? :)

конечно, можно менять animation-duration и animation-delay так, чтобы в сумме было одинаково (в оригинале 1.4s), но тогда изменение opacity будет длится разное время.
тупиковый подход, имхо.

Answer 2

[Stalker_RED]

цифры в анимации подбирал "на глаз", можно сделать и точнее, но лень искать в минифицированном коде какие именно параметры заданы в js.