Как создавать динамические, последовательные CSS-анимации ⇐ Html

[Гость]

Я пытаюсь создать динамичную, последовательную анимацию, которая начинается с того места, где закончилась предыдущая анимация. Анимация заключается в простом перемещении влево на 110 пикселей, но есть ли способ начать следующую анимацию со 110 пикселей, затем переместиться на 110 пикселей влево относительно этой новой позиции и продолжать делать это «n» раз на основе какой-то переменной, которую можно установить? Проблема в том, что анимация начинается с левого угла «0 пикселей», поэтому, даже если я сохраняю конечную позицию с помощью чего-то вроде анимации-fill-mode, она в конечном итоге просто сбросит позицию в начале следующей анимации, если я используйте что-то вроде анимационного количества итераций. Я не знаю, можно ли это сделать с помощью только HTML/CSS, и это вполне нормально. Мне просто хотелось бы понять, как еще я могу это сделать.
@keyframes moveleft { 0% { слева: 0 пикселей; } 100% { слева: 110 пикселей; } }