Cara Membuat Halaman Redirect Dengan Hitungan Waktu Mundur


Pagi sobat Sinonong, kali ini update blog lagi dengan tema cara membuat halaman redirect dengan hitungan waktu mundur.Ternyata untuk membuat halaman redirect dengan hitungan waktu mundur cukup mudah dan simpel sekali.Berikut caranya menggunakan koding ini dan simpan dalam bentuk format HTML :

<script type=”text/JavaScript”>
<!–
function eventualRedirect(redirectTo, timeoutPeriod) {
setTimeout(“location.href = redirectTo;”,timeoutPeriod);
}
// –>
</script>
<script type=”text/JavaScript”>
<!–
setTimeout(“location.href = ‘http://www.halamanyangakandituju.com&#8217;;”,10000);
–>
</script>
<br />
<br />
<br />
<br />
<center>
<br /><br />
<div style=”background-color: #a5ed3f; cursor: pointer; padding: 10px; width: 200px;”>
Anda akan dialihkan ke <br />
website baru</div>
<h4>
Dalam Waktu <script type=”text/javascript”>
// KONFIGURASI
var menit = 1; // Lamanya hitung mundur (dalam menit)
var detik = 10; // Detik standar (jangan diubah kecuali Anda tahu yang Anda lakukan)
var penghitung_detik = detik; // Set variabel detik yang lain untuk dimanipulasi
// HITUNG MUNDUR
penghitung_detik = 0;
function hitung_mundur() {
penghitung_detik–; // Setiap siklus 1 detik mengurangi nilainya 1 poin
if (penghitung_detik == -1) { // Deteksi detik ketika nilainya “0”
menit–; // Setiap siklus 1 menit mengurangi nilainya 1 poin
penghitung_detik = detik; // Me-reset detik untuk memulai hitung mundur menit yang baru
if (menit <= -1) { // Hitung mundur selesai
menit = 0;penghitung_detik = 0; // Menset menit dan detik ke “0”
clearTimeout(penghitung); // Stop hitung mundur
}
}
if (document.getElementById) {
document.getElementById(“hitung_mundur_tampil”).innerHTML=penghitung_detik; // Memasukkan nilai variabel menit dan detik untuk ditampilkan
}
penghitung=setTimeout(“hitung_mundur()”, 1000); // Set siklus penghitungan mundur (standar: 1 detik)
}
// INISIALISASI
if (document.all||document.getElementById)
document.write(‘ <b id=”hitung_mundur_tampil”>’+penghitung_detik+’ </b>’); // Format tampilan hitung mundur di antarmuka
hitung_mundur();
</script> Detik </h4>
<br /><div style=”background-color: #dee3a6; cursor: pointer; padding: 5px; width: 300px;”>
Terimakasih Telah menunggu.</div>
</center>

Untuk yang bold merah itu menandakan waktunya, 10000 ms itu sama dengan 10 detik jadi keduanya ini harus sama.Untuk settingan koding javascript yang lain tidak perlu diubah.Dan kalau mau menambahkan atau mempercantik tampilannya silahkan Anda membuat CSS untuk mengubah tampilannya.Semoga postingan kali ini bermanfaat.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s