Redirect Halaman Menggunakan Javascript TimeOut

Saya ingin memberi tahu sedikit tutorial untuk membuat halaman yang bisa melempar (redirect) ke halaman yang akan di tuju. Langsung saja deh lihat demo-nya dulu...
DEMO
Ok, script ini menggunakan javascript, letakkan kode berikut ke dalam tag body atau apapun. Silahkan dicoba
<script type="text/JavaScript">
function eventualRedirect(redirectTo, timeoutPeriod) {
setTimeout("location.href = redirectTo;",timeoutPeriod);
}
</script>

<script type="text/JavaScript">
setTimeout("location.href = 'http://edukasi-kreatif.blogspot.com/';",60000);//menentukan waktu hitung dalam mili second (detik)
</script>

<h4 align="center">Anda akan dialihkan menuju halaman utama dalam

<script type="text/javascript">
var menit = 1; // Lamanya hitungan mundur (dalam menit)
var detik = 60; // Detik standar (sesuaikan dengan perintah setTimeOut)
var penghitung_detik = detik; // Set variabel detik yang lain untuk dimanipulasi

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

if (document.all||document.getElementById)
document.write(' <b style="color:red" id="hitung_mundur_tampil">'+penghitung_detik+' </b>'); // Format tampilan hitung mundur di antarmuka
hitung_mundur();
</script>
 detik</h4>
Warna merah bisa diganti dengan halaman anda

Dapatkan kiriman artikel terbaru langsung ke email anda!
Masukan Alamat Email Anda

Delivered by FeedBurner

Artikel Terkait

Comments
0 Comments

0 komentar:

Posting Komentar

Template Design by Ahmad Syarif