Okay so I must create an infinite auto-scrolling horizontal image marquee using vanilla JS. I have the following code:

```js
//if(painkiller<14){painkiller++;} else{painkiller=0;backup2()}
var speed = 5;
var exeggcute = true;
var painkiller = 0;
var marquix = document.getElementById("marquis");
var backup = "";
var coquus = 0;
for (var painkiller = 0; painkiller < 15; painkiller++) {
  backup += "<img class='slide' src='" + ImgArray[painkiller].src + "' width='" + ImgArray[painkiller].width + "'>";
}
marquix.innerHTML = backup;

function riverflow() {
  marquix.scrollLeft += 5;
  if (marquix.children[0].getBoundingClientRect().left <= (marquix.children[0].width * -1)) {
    marquix.appendChild(marquix.children[0]);
    //marquix.getBoundingClientRect().left=0;
    //marquix.children[0].style.transform="translateX(133px)"
  }
}

//function backup2(){marquix.innerHTML=backup;}
setInterval('riverflow()', 50);
exeggcute = true;
```

```html
<head>
<script>
  var ImgArray = [];
  for (var i = 0; i < 15; i++) {
    ImgArray[i] = new Image();
    ImgArray[i].src = "imgx/imagen" + (i + 1) + ".jpg";
    ImgArray[i].width = 133;
  }
</script>
</head>

<body>
  <div id="marquis">

  </div>
</body>
```

Basically I'm creating the image chain, then filling with it the innerHTML of a div, then assigning said div to a variable, and finally calling a repetitive function through setInterval(). Now, what that function does is a simple scroll to the left and - when the first image is completely out of the viewport - use appendChild to rip the first child element or img from the image chain then put it at the end of it. So no image overcharge is produced and the marquee uses the same 15 element once and again.

Here's my problem, though: when the appendChild function fires, the image that's out of the viewport is removed, however, the next image in line - as well as the rest of the chain - does not preserve its current position, and is instead forcefully scrolled to fill the gap left by the then-first image that's now at the end. Thus, the condition of the appendChild (which was the first children of the div being completely out of the viewport) becomes true and activates the function - leading the whole marquee to slide non-stop and out of control, as the appendChild is firing continuously.

How can I fix it?