Blog Kategori:
Sayfanızda bir geri sayım sayacı görüntülemek istiyorsunuz. Ama bu sayacı istediğiniz an başlatıp, istediğiniz an durdurup istediğiniz an devam ettirmek istiyorsunuz. O zaman aşağıdaki kodları <body> ..... </body> tagleri arasına yerleştirebilirsiniz.
Sayacın görüneceği yere;
<span id="timer"></span>
kodunu yerleştirin.
Başlat / Duraklat / Devam Et düğmelerini yerleştireceğiniz yere;
<button id="start">Başlat</button>
<button id="pause">Duraklat</button>
<button id="resume">Devam Et</button>
kodlarını yerleştiriniz.
Script kodunu da bunlardan sonraki herhangi bir yere yerleştiriyoruz. Bu kodlar sayfada görünmez sadece etkisini görürüz.
<script language="javascript">
// Burada düğmelerin ve sayacın tanımlamaları var
var timer = document.getElementById("timer");
var start = document.getElementById("start");
var pause = document.getElementById("pause");
var resume = document.getElementById("resume");
var id;
var value = "00:00";
function startTimer(m, s) {
timer.textContent = m + ":" + s;
// Eğer süre bittiğinde bir sayfaya yönlendirmek istiyorsanız bu kodları yerleştiriniz (istemiyorsanız yönlendirme bitişe kadar olan yeri silebilirsiniz
if (s == 0) {
// Eğer yönlendirmeden önce bir uyarı göstermek istiyorsanız (istemiyorsanız satırı silebilirsiniz)
alert ('lokmanbas.net sayfasına yönleniyorsunuz');
// Yönlendirme kodu
window.location.href = "http://www.lokmanbas.net";
return;
}
// Yönlendirme ve uyarı bitişi
if (s == 0) {
if (m == 0) {
return;
} else if (m != 0) {
m = m - 1;
s = 60;
}
}
s = s - 1;
id = setTimeout(function () {
startTimer(m, s)
}, 1000);
}
function pauseTimer() {
value = timer.textContent;
clearTimeout(id);
}
function resumeTimer() {
var t = value.split(":");
startTimer(parseInt(t[0], 10), parseInt(t[1], 10));
}
startTimer(0, 30); // Buraya zamanlamanın ne kadar olduğunu yazıyorsunuz. Örn. 5 dakika 30 saniye için startTimer(5, 30); şeklinde
pause.addEventListener("click", pauseTimer, false);
resume.addEventListener("click", resumeTimer, false);
</script>
Yorumlar
merhaba hocam başlat
merhaba hocam başlat butonunun işlevi yok.Sayfa yüklendiğinde otomatik geri sayıyor.
Merhabalar. Kodlarınızı
Merhabalar. Kodlarınızı buraya ekleyebilirseniz yardımcı olabilirim. Eklemeniz gereken kodları tekrar hatırlatayım;
<span id="sayac"></span> (Sayacın görüntülenmesini istediğiniz yere bu span kodunu yerleştirmelisiniz.)<script language="javascript"><!--
// Buraya kaç saniyelik bir geri sayım yapmak istediğinizi yazıyorsunuz //
var zaman=31
function gerisayim(){
if (zaman!=0){
zaman-=1
document.getElementById('sayac').innerHTML=zaman
}
else{
// Süre bittiğinde gerçekleşecek işlemler //
window.location.href = "BURAYA ADRES GELECEK"; // Buraya adres gelecek örn. http://www.lokmanbas.net veya /anasayfa.html gibi //
alert ('BURASI SAYFADA GÖRMEK İSTEDİĞİNİZ UYARI YAZISI İÇİN'); // Buraya da sayfada göstermek istediğiniz uyarıyı yazınız. Eğer bir mesaj / uyarı göstermek istemezseniz bu satırı silebilirsiniz //
return
}
setTimeout("gerisayim()",1000)
}
gerisayim()
//-->
</script>
Yeni yorum ekle