Jika Anda sering mengunduh file di situs-situs file sharing seperti 4shared, rapidshare dll pastinya sering menjumpai countdown timer atau perhitungan waktu mundur sebelum muncul link download filenya. Mungkin Anda bertanya-tanya, mengapa perlu countdown tersebut? apa manfaatnya bagi situs tersebut? Ya.. manfaatnya ada, yaitu supaya pengunjung mau melihat iklan-iklan yang ada di halaman tersebut sambil menunggu countdown timer nya selesai. Apalagi jika iklannya adalah iklan PPC tentunya hal ini akan memberikan revenue bagi pemilik situs tersebut. Khusus untuk situs file sharing biasanya memanfaatkan pengunjung yang tidak sabaran menunggu countdown selesai untuk menawarkan layanan premium download.
Tentang countdown timer link download ini, bisa gak sih kita membuatnya sendiri? dan kalau bisa, kira-kira sulit nggak? Jawabannya adalah bisa, dan tidak sulit kok karena kita bisa membuatnya sendiri dengan Javascript. Scriptnya sendiri mudah dipahami.
Berikut ini adalah contoh halaman yang berisi countdown timer downloadnya.
download.html
<html>
<head>
<title>Count Down Download dengan JavaScript</title>
<script type="text/javascript">
var counter = 10;
function countDown()
{
if(counter>=0)
{
document.getElementById("timer").innerHTML = counter;
}
else
{
download();
return;
}
counter -= 1;
var counter2 = setTimeout("countDown()",1000);
return;
}
function download()
{
document.getElementById("link").innerHTML = "<a href='http://namasitus/filedownload'>Download</a>";
}
</script>
</head>
<body onload="countDown();">
<h1>File Download</h1><br />
<h3>Link download akan muncul dalam <span id="timer"></span> detik.</h3>
<span id="link"></span>
</body>
</html>
Penjelasan script di atas adalah sebagai berikut:var counter = 10;digunakan untuk menset lamanya nilai awal countdown adalah 10. Jika Anda ingin mengubah nilai awal countdown, maka cukup mengubah nilainya saja.
function countDown()
{
if(counter>0)
{
document.getElementById("timer").innerHTML = counter;
}
else
{
download();
return;
}
counter -= 1;
var counter2 = setTimeout("countDown()",1000);
return;
}
Function countDown() di atas digunakan untuk menampilkan nilai countdown nya. Jika nilai counter nya masih >= 0, maka nilai counter nya akan ditampilkan pada <span id="timer"></span> dengan menggunakan perintah document.getElementById("timer").innerHTML = counter;
namun jika tidak, maka akan menampilkan link downloadnya dengan memanggil function download(), di mana isi function download() nya adalah sbb:function download()
{
document.getElementById("link").innerHTML = "<a href='http://namasitus/namafile'>Download</a>";
}
Perintah document.getElementById("link").innerHTML = "<a href='http://namasitus/namafile'>Download</a>";
digunakan untuk menampilkan link download di dalam bagian <span id="link"></span>.Apa kegunaan dari perintah
counter -= 1;dalam function
countDown() di atas? perintah tersebut digunakan untuk mengurangi satu demi satu nilai counter nya (decrement). Namanya saja countdown, pastinya counternya juga berkurang 
Terakhir, apa kegunaan dari perintah
var counter2 = setTimeout("countDown()",1000);
Perintah tersebut digunakan untuk memanggil kembali function countDown() setelah 1000 milisekon (1 detik). Jadi function countDown() ini senantiasa dipanggil setiap selang 1 detik, sehingga jarak pergantian nilai counternya adalah setiap 1 detik. Jika Anda ingin memperlambat pengurangan counternya, cukup menambah nilai setTimeout() nya dengan nilai yang lebih besar, misalnya 5000 jika ingin delay counternya 5 detik.Mudah bukan membuat script
0 komentar:
Posting Komentar