How to play animation not circular (animate with scroll)

Hi, I’m making scroll base animate for camera and I got a question of this

The question is “Is it possible to set animatoin not circular?”

I made function that playing animation with scroll, and it work well but, sometimes if I scroll down it will go first frame of animation(like overflow) and If i scroll top it goes last frame of animation (like underflow)

this is part of my code

document.body.onscroll = () => {
    // calculate the current scroll progress as a percentage

    scrollPercent =
      ((document.documentElement.scrollTop || document.body.scrollTop) /
        ((document.documentElement.scrollHeight || document.body.scrollHeight) -
          document.documentElement.clientHeight)) *

    const delta = (scrollPercent - lastPersent) * secPerScrollpersent;
    lastPersent = scrollPercent;


    // (document.getElementById('scrollProgress') as HTMLDivElement).innerText =
    //   'Scroll Progress : ' + scrollPercent.toFixed(2);

what I have to set about animation for not play animation circular? I tried THREE.LoopOnce but not work