Страдаю фигней в целях практики, в итоге сделал что-то вроде этого(Осторожно, получилось прожорливо по ресурсам):
Теперь думаю как цепочку запустить по кольцу, сохранив при этом текущую анимацию. Подайте идею, а то уже мозг плывет. Советы про оптимизацию тоже были бы не лишними.
Mazino, в редакторе CodePen есть кнопочка "View compiled CSS", там чистый CSS без хитростей препроцессора - он может быть для вас понятнее, чем исходник.
Mazino, Тут Ana Tudor нашаманила альтернативный вариант этой анимации (правда без поддержки IE/Edge). Очень советую посмотреть в образовательных целях:
P.S.: Количество элементов действительно можно уменьшить в два раза, тут я затормозил немного, но спишем это на воскресенье.
Ivan Bogachev, хоть подобные способы проще и практичней, но для меня они слишком высокоуровневые, мне больше интересно как описать это функцией примерно так, как это происходит под капотом. Т.е вычислять куда подвинуть эту пачку пикселей на очередном кадре.
