Довольно часто возникает необходимость в анимации, которую трудно или даже вовсе невозможно создать с помощью переходов, определенных на CSS - cвойствах элементов. Например, это может быть мультфильм или сложный индикатор прогресса. Покадровая анимация, состоящая из отдельных изображений, — идеальное решение для подобных случаев, но удивительно, насколько сложно реализовать ее гибким и удобным способом.

Возможно, вы сейчас задаетесь вопросом, почему бы просто не прибегнуть к помощи анимированных изображений в формате GIF. Разумеется, анимиро-ванные GIF-изображения прекрасно подходят во многих ситуациях, но у них есть несколько недостатков, которые в определенных сценариях делают их нежелательным решением:
‰ они ограничены палитрой из 256 цветов, одной и той же для всех кадров;
‰ они не поддерживают прозрачность альфа-канала, что может стать большой проблемой, если мы не знаем, что будет находиться под нашим анимированным GIF-изображением. Например, так часто бывает, когда изображение представляет собой индикатор прогресса;  Читать далее