antronic · June 25, 2022 01:02
diff --git a/progress-time.html b/progress-time.html
 <html>
  <head>
    <title>Progress time</title>
    <style type="text/css">
      html, body {
        margin: 0;
        padding: 0;
      }
      #wrapper {
        width: 100%;
        height: 5px;
        background: #111;
      }
      
      #progress {
        width: 0%;
        height: 100%;
        background: #fafafa;
        transition: all 1s linear;
      }
      
      #num {
      }
    </style>
  </head>
  <body>
    <div id="wrapper">
      <div id="progress"></div>
    </div>
    <p id="num">loading...</p>
    <script>
      var start = new Date(1647867158177).getTime()
      var target = new Date(1647874800000).getTime()
      
      setInterval(function() {
        var now = Date.now()
        var diff = ((target - now) / (target - start)) * 100

        var progressEl = document.querySelector('#progress')
        var numEl = document.querySelector('#num')
        progressEl.style.width = (100 - diff) + '%'
        numEl.innerText = (100 - diff) + '%'
      }, 1000)
    </script>
  </body>
 </html>
	<html>
	<head>
	<title>Progress time</title>
	<style type="text/css">
	html, body {
	margin: 0;
	padding: 0;
	}
	#wrapper {
	width: 100%;
	height: 5px;
	background: #111;
	}

	#progress {
	width: 0%;
	height: 100%;
	background: #fafafa;
	transition: all 1s linear;
	}

	#num {
	}
	</style>
	</head>
	<body>
	<div id="wrapper">
	<div id="progress"></div>
	</div>
	<p id="num">loading...</p>
	<script>
	var start = new Date(1647867158177).getTime()
	var target = new Date(1647874800000).getTime()

	setInterval(function() {
	var now = Date.now()
	var diff = ((target - now) / (target - start)) * 100

	var progressEl = document.querySelector('#progress')
	var numEl = document.querySelector('#num')
	progressEl.style.width = (100 - diff) + '%'
	numEl.innerText = (100 - diff) + '%'
	}, 1000)
	</script>
	</body>
	</html>