Download 10sec Button

HTML

<link href="style.css" rel="stylesheet"></link>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.2/css/all.min.css" rel="stylesheet"></link>

<style>
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap');

*{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: "Poppins", sans-serif;

}

.download-container{
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.download-btn{
  position: relative;
  background: #4285F4;
  color: #fff;
  width: 260px;
  padding: 18px 0;
  text-align: center;


  font-size: 1.3em;
  font-weight: 400;
  text-decoration: none;
  border-radius: 5px;
  box-shadow: 0 5px 25px rgba(1 1 1 / 15%);
  transition: background 0.3s ease;
}

.download-btn:hover{
  background: #2874F3;
}

.download-btn i{
  margin-left: 5px;
}

.countdown{
  font-size: 1.5em;
  font-weight: 700;
  margin-bottom: 20px;
}

.countdown span{
  color: #0693F6;
  font-size: 1.5em;
  font-weight: 800;
}

.pleaseWait-text{
  font-size: 1.1em;
  font-weight: 600;
  display: none;
}

.manualDownload-text{
  font-size: 1.1em;
  font-weight: 600;
  display: none;
}

.manualDownload-link{
  color: #0693F6;
  font-weight: 800;
  text-decoration: none;
}
      
</style>


    <div class="download-container">
      <a class="download-btn" href="#">Download Files <i class="fas fa-download"></i></a>
      <div class="countdown"></div>
      <div class="pleaseWait-text">Please wait..</div>
      <div class="manualDownload-text">
        If the download didn't start automatically, <a class="manualDownload-link" href="">click here.</a>
      </div>
</div>

    <script type="text/javascript">
    const downloadBtn = document.querySelector(".download-btn");
    const countdown = document.querySelector(".countdown");
    const pleaseWaitText = document.querySelector(".pleaseWait-text");
    const manualDownloadText = document.querySelector(".manualDownload-text");
    const manualDownloadLink = document.querySelector(".manualDownload-link");
    var timeLeft = 10;

    downloadBtn.addEventListener("click", () => {
      downloadBtn.style.display = "none";
      countdown.innerHTML = "Download will begin automatically in <span>" + timeLeft + "</span> seconds."; //for quick start of countdown

      var downloadTimer = setInterval(function timeCount(){
        timeLeft -= 1;
        countdown.innerHTML = "Download will begin automatically in <span>" + timeLeft + "</span> seconds.";

        if(timeLeft <= 0){
          clearInterval(downloadTimer);
          pleaseWaitText.style.display = "block";
          let download_href = "https://drive.google.com/file/d/1AwiXRd_gpZfXU7moYwxqRhIs5UfsPYPv/view?usp=drivesdk"; //enter the downloadable file link URL here
          window.location.href = download_href;
          manualDownloadLink.href = download_href;

          setTimeout(() => {
            pleaseWaitText.style.display = "none";
            manualDownloadText.style.display = "block";
          }, 4000);
        }
      }, 1000);
    });
    
  
    </script>