[Перевод] Знакомимся с Web Animations API

Скрипты и советы | 31 января 2020 944

Уроки CSS на Хабрахабре, habrahabr.ru, CSS, JavaScript, HTML, html, css, javascript, animation, анимация,



Доброго времени суток, друзья!

Представляю Вашему вниманию перевод статьи Charlie Gerard «Exploring the Web Animations API».

Знакомимся с Web Animations API


Веб API постоянно эволюционируют. Некоторые из них, такие как Console или Canvas, хорошо поддерживаются всеми браузерами, другие по-прежнему находятся на стадии разработки.

Одним из API, находящимся на стадии разработки, является Web Animations API или WAAPI. Несмотря на то, что первый вариант спецификации был опубликован в 2012 году, а сам API впервые реализован в браузерах Firefox и Chrome в 2014 году, я узнала о нем совсем недавно (я тоже раньше о нем не слышал — прим.пер.).

Он позволяет разработчикам работать с CSS анимацией средствами JavaScript. Его синтаксис похож на синтаксис традиционной CSS анимации, но имеет некоторые особенности, которые облегчают разработчикам создание и изменение анимации.

Давайте рассмотрим этот API на простом примере.
Читать дальше →
[Перевод] Анимация при прокрутке с помощью WAAPI и ScrollTimeline

Спецификация W3C Scroll-linked Animations — это экспериментальное дополнение, которое позволяет связать развитие...

Подробнее
[Перевод] Исследование производительности анимации на основе скрола страницы

Что нового в анимации на основе скрола? Анимация на основе скрола - это способ добавить интерактивности и визуального...

Подробнее
[Перевод] Нововведения CSS – Июль 2020 (Gap, Aspect ratio, Masonry, Subgrid)

Приветствую. Представляю вашему вниманию перевод статьи «CSS News July 2020», опубликованной 7 июля 2020 года автором...

Подробнее
[Перевод] Анимации CSS, основанные на времени

Демонстрация анимаций В моем предыдущем посте Time Uniform For CSS Animation я рассказал о способе создания...

Подробнее
[Из песочницы] CSS Containment

От переводчика: слог у Пола Льюиса весьма своеобразный, поэтому перевод исходной статьи местами может выглядеть...

Подробнее
Могут ли PWA (Progressive Web Apps) образца 2018 года составить достойную конкуренцию нативным приложениям?

Когда изменения происходят постепенно, шаг за шагом, порой бывает трудно заметить насколько они драматичны и...

Подробнее

💬 Комментарии

В связи с новыми требованиями законодательства РФ (ФЗ-152, ФЗ «О рекламе») и ужесточением контроля со стороны РКН, мы отключили систему комментариев на сайте.

🔒 Важно Теперь мы не собираем и не храним ваши персональные данные — даже если очень захотим.

💡 Хотите обсудить материал?

Присоединяйтесь к нашему Telegram-каналу:

https://t.me/tcsecms/

Нажмите кнопку ниже — и вы сразу попадёте в чат с комментариями