Loading halaman Tutorial Visual Basic, Delphi, PHP - Calon Programer : Membuat Script Timer Download Javascript ...

Berbagi ilmu lagi, semoga ga pada bosen :p
Sesuai dengan judul diatas, kita akan membuat timer hitung mundur atau download waiting time dengan menggunakan javascript.
Bagi kalian yang belum mengetahui atau masih bingung apa itu timer download, nah kita bisa lihat atau bahkan sering mengalami pada saat mendownload sebuah file di file hosting, terkadang ada waktu untuk menunggu sekian puluh detik sebelum link download itu tampil.
script nya sbb:
  1. <script type="text/javascript">  
  2.     var counter = 60;  
  3.     function countDown()  
  4.     {  
  5.         if(counter>=0)  
  6.         {  
  7.             document.getElementById("timer").innerHTML = counter;  
  8.         }  
  9.         else  
  10.         {  
  11.             download();  
  12.             return;  
  13.         }  
  14.         counter -= 1;   
  15.   
  16.         var counter2 = setTimeout("countDown()",1000);  
  17.         return;  
  18.     }  
  19.     function download()  
  20.     {  
  21.         document.getElementById("link").innerHTML = "<a href='http://namasitus/filedownload'>Download</a>";  
  22.     }  
  23.    </script>  

Lalu pada bagian tag
  1. <body>  
tambahkan pemanggilan function javascript nya:
  1. <body onload="countDown();">  
  2.   
  3. </body>  

Lalu satu tahap lagi, yaitu memberikan tag untuk menampilkan link download tsb saat timer sudah mencapai waktunya.
  1. <h1>File Download</h1><br />  
  2. <h3>Link download akan muncul dalam <span id="timer"></span> detik.</h3>   
  3.   
  4. <span id="link"></span>  



Untuk script lengkap sbb :
  1. <html>  
  2. <head>  
  3.    <title>Count Down Download dengan JavaScript</title>  
  4.    <script type="text/javascript">  
  5.     var counter = 10;  
  6.     function countDown()  
  7.     {  
  8.         if(counter>=0)  
  9.         {  
  10.             document.getElementById("timer").innerHTML = counter;  
  11.         }  
  12.         else  
  13.         {  
  14.             download();  
  15.             return;  
  16.         }  
  17.         counter -= 1;   
  18.   
  19.         var counter2 = setTimeout("countDown()",1000);  
  20.         return;  
  21.     }  
  22.     function download()  
  23.     {  
  24.         document.getElementById("link").innerHTML = "<a href='http://namasitus/filedownload'>Download</a>";  
  25.     }  
  26.    </script>  
  27. </head>  
  28.   
  29. <body onload="countDown();">  
  30. <h1>File Download</h1><br />  
  31. <h3>Link download akan muncul dalam <span id="timer"></span> detik.</h3>   
  32.   
  33. <span id="link"></span>  
  34.   
  35. </body>  
  36. </html>  

Kita bahas satu per satu...
  1. var counter = 60;  
Script diatas untuk mendeklarasikan sebuah variable dan memberikan nilainya.

  1. function countDown()  
  2. {  
  3.     if(counter>0)  
  4.     {  
  5.        document.getElementById("timer").innerHTML = counter;  
  6.     }  
  7.     else  
  8.     {  
  9.        download();  
  10.        return;  
  11.     }  
  12.     counter -= 1;   
  13.   
  14.     var counter2 = setTimeout("countDown()",1000);  
  15.     return;  
  16. }  
Script diatas adalah sebagai function untuk menentukan dan menampilkan nilai countdown nya.

  1. function download()  
  2. {  
  3.    document.getElementById("link").innerHTML = "<a href='http://namasitus/namafile'>Download</a>";  
  4. }  
Sebagai function untuk menggenerate link download nya yang akan tampil.

Rewrite Source : http://blog.rosihanari.net/membuat-script-countdown-timer-link-download/

0 Reply :

Posting Komentar

Jika ada pertanyaan atau request,Komentar pada tab blogger akan lebih memudahkan saya untuk membalasnya karena lebih mudah melakukan pengecekan komentar.