Bu kez javascript ile geriye doğru sayan bir sayaç uygulamasını inceleyeceğiz. Günlüğümü uzun bir süre takip edenler, günlüğü güncelleştirme esnasında buna benzer bir geriye sayan sayaç ile karşılaşmışlardır. Benzeri uygulamaları yapabilmeniz için, güzel bir gerisayım sayacını inceledim.
Online Countdown Timer başlığında paylaşılan ve altta örneğini gördüğünüz sayacı nasıl kullanacağınıza göz atalım.
<style>
table.timer {font: bold 24pt Tahoma, Arial, Helvetica; color: brown;}
table.timer.td {padding: 0; margin: 0;}
table.timer tr.labels td {font-size: 10pt;}
</style><script type='text/javascript'>
var timerEnd = new Date(Date.UTC(2007, 12, 31, 0, 0, 0));
</script>
<script src='https://file.dmry.net/blog/01/timer.js'></script>
Gördüğünüz üzere geri saymaya başladı 🙂 Ü harfinde bir problem varmış gibi görünebilir. Sitemin karakter kodlaması UTF-8 fakat javascript dosyasının ANSI olmasından ötürü bu problem.
Kullanımı
Kullanım için alttaki kodları sayfanıza eklemeniz gerekecek. Bunlar CSS ve JavaScript kodlarıdır.
<style>
table.timer {
font: bold 24pt Tahoma, Arial, Helvetica;
color: brown;
}
table.timer.td {
padding: 0;
margin: 0;
}
table.timer tr.labels td {
font-size: 10pt;
}
</style>
<script type='text/javascript'>
var timerEnd = new Date(Date.UTC(2007, 12, 31, 0, 0, 0));
</script>
<script src='https://file.dmry.net/blog/01/timer.js'>
</script>
Ayrıca timer.js dosyasını da indirmeniz gerekiyor ve bunu da sunucunuza yükleyeceksiniz.
Yukarıdaki kod içerisinde kendisi hakkında bilgi edinmemiz gereken iki satır var. Bunlardan ilki,
var timerEnd = new Date(Date.UTC(2007, 12, 31, 0, 0, 0));
olanı. Eminim farkına vardınız.. Ama yine de açıklamak istiyorum. 2007, 12, 31, 0, 0, 0 olarak tanımlanan yeri, geri sayımın başlayacağı tarih olarak değiştireceksiniz.
<script src='https://file.dmry.net/blog/01/timer.js'>
satırındaki adresi ise, timer.js dosyanızın yer aldığı adres ile değiştireceksiniz.