#фишка дня

Итак, сегодня в уютный канальчик™️ с ноги залетает уже всем известный Джей c кое-чем насколько потрясающим, настолько же и забытым.

И это API document.getAnimations(), позволяющий не только получить список всех CSS-анимаций, но и, внимание, выставить промис и дождаться их выполнения! 🤯

const animations = document.getAnimations()
.map(a => a.finished)
await Promise.all(animations)

Сразу кодпен: https://codepen.io/alinaki/pen/rNoEOwX

*с некоторых пор я начал форкать пены, потому что пропадают иной раз

Теперь о применимости.

Я нынче разработчик корпоративный, потому мне интересно это, например, с позиции совершения какой-нибудь операции по скрытию уведомления-тоста. Во время онбординга, например.

Ну а разработчикам промо-сайтов важность синхронизации действий и анимаций объяснять не надо.

Отличный пример забытых технологий 🙂

Не, ну серьёзно, оно с 75 Firefox доступно, как я мог его проглядеть?

А я знаю, как. Я же писал уже, что PR-служба Chrome работает прекрасно только в том случае, когда что-то появилось там первым...

#css #js #animations #promise

#фишка дня

Итак, сегодня в уютный канальчик™️ с ноги залетает уже всем известный Джей c кое-чем насколько потрясающим, настолько же и забытым.

И это API document.getAnimations(), позволяющий не только получить список всех CSS-анимаций, но и, внимание, выставить промис и дождаться их выполнения! 🤯

const animations = document.getAnimations()
.map(a => a.finished)
await Promise.all(animations)

Сразу кодпен: https://codepen.io/alinaki/pen/rNoEOwX

*с некоторых пор я начал форкать пены, потому что пропадают иной раз

Теперь о применимости.

Я нынче разработчик корпоративный, потому мне интересно это, например, с позиции совершения какой-нибудь операции по скрытию уведомления-тоста. Во время онбординга, например.

Ну а разработчикам промо-сайтов важность синхронизации действий и анимаций объяснять не надо.

Отличный пример забытых технологий 🙂

Не, ну серьёзно, оно с 75 Firefox доступно, как я мог его проглядеть?

А я знаю, как. Я же писал уже, что PR-служба Chrome работает прекрасно только в том случае, когда что-то появилось там первым...

#css #js #animations #promise #бородач

#фишка дня

Итак, сегодня в уютный канальчик™️ с ноги залетает уже всем известный Джей c кое-чем насколько потрясающим, настолько же и забытым.

И это API document.getAnimations(), позволяющий не только получить список всех CSS-анимаций, но и, внимание, выставить промис и дождаться их выполнения! 🤯

const animations = document.getAnimations()
.map(a => a.finished)
await Promise.all(animations)

Сразу кодпен: https://codepen.io/alinaki/pen/rNoEOwX

*с некоторых пор я начал форкать пены, потому что пропадают иной раз

Теперь о применимости.

Я нынче разработчик корпоративный, потому мне интересно это, например, с позиции совершения какой-нибудь операции по скрытию уведомления-тоста. Во время онбординга, например.

Ну а разработчикам промо-сайтов важность синхронизации действий и анимаций объяснять не надо.

Отличный пример забытых технологий 🙂

Не, ну серьёзно, оно с 75 Firefox доступно, как я мог его проглядеть?

А я знаю, как. Я же писал уже, что PR-служба Chrome работает прекрасно только в том случае, когда что-то появилось там первым...

#css #js #animations #promise #бородач