JSFiddle - React, Tailwind, and code Playground

HTML

<p>
  Weiterleitung in <span id="duration">10.0</span> Sekunden.
  <a href="#" onclick="move();">Start/Stopp.</a>
</p>
<div id="myProgress">
  <div id="myBar">10 %</div>
</div>

CSS

#myBar {
  width: 10%;
  height: 30px;
  background-color: #04aa6d;
  text-align: center;
  line-height: 30px;
  color: white;
}

JavaScript

let interval = null
let total = 11112
let now1 = null
let remain = null
function move() {
  if (!interval) {
    now1 = performance.now() - (remain ? remain : 1112)
    let elem1 = document.getElementById("myBar")
    let elem2 = document.getElementById("duration")
    interval = setInterval(frame, 100)
    function frame() {
      let now2 = performance.now()
      let current = now2 - now1
      if (current >= total) {
        clearInterval(interval)
        interval = null
        // window.location.href = "...";
        alert("fertig")
      } else {
        let width = parseInt((current / total) * 100.0)
        elem1.style.width = width + "%"
        elem1.innerHTML = width + " %"
        elem2.innerHTML = ((total - current) / 1000.0).toFixed(1)
      }
    }
  } else {
    clearInterval(interval)
    interval = null
    remain = performance.now() - now1
  }
}
move()