Javascript İle Geri Sayım (Durdur/Başlat/Devam Et)

Detaylı İçerik Arama

Herhangi bir filtre seçin ve sonuçları görmek için Uygula'ya tıklayın.

lookmer tarafından 11 Ekim 2018 - 10:24 tarihinde gönderildi

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

javascript