Кто-нибудь подскажет, как лучше исправить недостаток в этой реализации. А точнее для меня несколько недостатков. Во-первых, когда данный код находится на сайте где-то на средних секциях, нужно что бы сам шарик не двигался, пока он не окажется на середине экрана. Также проблема заключается в том, что бы он не терял свои координаты, будь-то начальные или на середине скролла, когда страницу перезагружаешь, и тут же начинаешь скролить( в этом случае, шарик вообще теряет координаты линии svg). Уже второй день ломаю голову с этой проблемой. Не знаю как решить. Может, кто подскажет? Вот пример на кодпен:
https://codepen.io/olegleshiy/pen/gOpONQL