Button Download With Countdown Timer

Button Download With Countdown Timer

Sebelumnya kita sudah pernah membahas tentang Cara Membuat Konten Sosial Locker yg memanfaatkan tombol social network untuk membuka link downloadnya. Dimana kita sekarang memanfaatkan Auto Redirect dengan Timer untuk membuka link download internal atau external.




<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>

Simpan javascript diatas kode </head> atau </body>
Berikut data markup'nya

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

Terkahir tambahkan CSS untuk menghilangkan link download

#link-download {
display: none
}

Selamat mencoba !!!
Jangan lupa untuk memberi vote di bawah ini, terima kasih...

1 Response to "Button Download With Countdown Timer"

  1. kalo mau rubah waktunya gimana , dan merubah css tombolnya

    ReplyDelete

Komentar yang menyertakan iklan, atau titip link, akan dimasukan ke Folder SPAM.

Untuk pertanyaan di luar Topik Artikel silahkan kik OOT (apabila dipertanyakan di sini, mohon maaf apabila tidak dibalas).