Make a Button Download With Countdown Timer

Make a Button Download With Countdown Timer

Make a Button Download With Countdown Timer
Creating a Download Button With a Count Back  - There is a download button that utilizes social media buttons to open the download link. And the download button that we will discuss uses Auto Redirect with Timer to open internal or external download links.



DEMO

Save Javascript above the code </head> or </body> 
<script type="text/javascript">
//<![CDATA[
function generate() {
var linkDL = document.getElementById("download"),
btn = document.getElementById("btn"),
direklink = document.getElementById("download").href,
waktu = 10;
var teks_waktu = document.createElement("span");
linkDL.parentNode.replaceChild(teks_waktu, linkDL);
var id;
id = setInterval(function () {
waktu--;
if (waktu < 0) {
teks_waktu.parentNode.replaceChild(linkDL, teks_waktu);
clearInterval(id);
window.location.replace(direklink);
linkDL.style.display = "inline";
} else {
teks_waktu.innerHTML = "" + waktu.toString() + " Detik";
btn.style.display = "none";
}
}, 1000);
}
//]]>
</script>

Enter the code below in HTML mode , in your post.

 <button onclick="generate()" id="btn">Download</button>
<a id="download" href="link-download" style="display:none">Download Template</a>

Add CSS to remove the download link

 #link-download {
display: none
}

Good luck .... That's the Tutorial '' Make a Button Download With Countdown Timer '' Don't forget to Like, share and comment, huh ...
Previous Post
Next Post

post written by:

I am a web designer and developer. Sharing knowledge is my passion and web designing is my interest but it is not bigger than my interest in Islam.

0 Comments: