Как работает рекурсивная анимация ниже SVG

Question

Я имею в виду анимацию SVG, приведенную ниже по ссылке https://codepen.io/thinkdesign/pen/JybJOq Я не могу понять, как здесь работает рекурсия

    var offset = 0;
var animation = function() {
  offset -= 100;
  pattern.animate({ x: offset }, 500, mina.ease, animation);
};

здесь мы меняем ось х при каждом вызове функции,поэтому ось х должна выходить за пределы экрана в какой-то момент.Пожалуйста, помогите мне понять, как это работает

Answer 1

Здесь ничего не движется по странице.x, который перемещается сюда, является смещением X шаблона.SVG <pattern> - это заливка, состоящая из «плитки», которая повторяется бесконечно во всех направлениях.<pattern> имеет атрибуты x и y, которые сообщают браузеру, откуда начинать мозаику.Анимирование смещения x рисунка приводит к тому, что плитка постоянно движется по вашему объекту.

Представьте прямоугольное окно, лежащее на плиточном полу.Если вы сдвинете это окно по полу, оно будет выглядеть так, как будто рисунок плитки перемещается через окно.