Home » » Membuat Tombol Downlod Dengan CountDownTimer

Membuat Tombol Downlod Dengan CountDownTimer

    Selamat datang agan/aganwati kali ini saya admin akan membahas tentang cara Membuat Tombol Downlod Dengan CountDownTimer. Disini saya memberikan beberapa caranya sekaligus untuk pembahasan OOT di blog saya. Dan tombol download yang akan kita bahas memanfaatkan Auto Redirect dengan Timer untuk membuka link download internal atau external. maka dari itu simak pembahasannya.


      Langkah-langkahnya: 

    • Simpan script dibawah ini diatas kode </head> atau </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>

      • Masukan Kode Dibawah ini dalam Mode HTML di Postingan Agan. 

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






        • Terakhir agan taruh kode CSS ini untuk mengilangkan link download, simpan kodenya di atas]]></b:skin> untuk memudahkanya gunakan (ctrl + F) 



          • #link-download {
            display: none
            }

            Sekian Postingan dari saya semoga artikel ini dapat bermanfaat selamat mencoba!

        0 komentar:

        Post a Comment