Kendime bir sistem yapıyordum ve geri sayıma ihtiyacım vardı. Bunun için javascripti kullanarak basit bi şekilde geri sayım aracını yaptım. Bu sayede benim işime yaradı. Bende paylaşmayı düşündüm belki birininde ihtiyacı vardır.

Yaptığımız sistemde ortaya bi sayaç diye div açtık. Buraya saniyeyi yazdırdım ve her saniye düştüğünde sayfanın arkaplanınıda değiştirdim.

Demo İçin Tıklayınız.











Javascript Geri Sayım - Kodlattır

<script></script>







10




<script>

$(document).ready(function () {



var sayac = 10; //Sayacı 10'a eşitledik

var interval = setInterval(function() { //Fonksiyon Başlangcı

sayac--;// Sayacı azaltıyoruz

if(sayac == 10){

$('body').css({background: '#f44336'}); // arkaplan değişmesi için gerekli kod.

$('.sayac').text(sayac); //Sayac div'ine sayaçtaki sayıyı yazması için gerekli kod

}else if(sayac == 9){

$('body').css({background: '#e91e63'}); // arkaplan değişmesi için gerekli kod.

$('.sayac').text(sayac); //Sayac div'ine sayaçtaki sayıyı yazması için gerekli kod

}else if(sayac == 8){

$('body').css({background: '#9c27b0'});// arkaplan değişmesi için gerekli kod.

$('.sayac').text(sayac); //Sayac div'ine sayaçtaki sayıyı yazması için gerekli kod

}else if(sayac == 7){

$('body').css({background: '#673ab7'}); // arkaplan değişmesi için gerekli kod.

$('.sayac').text(sayac); //Sayac div'ine sayaçtaki sayıyı yazması için gerekli kod

}else if(sayac == 6){

$('body').css({background: '#3f51b5'}); // arkaplan değişmesi için gerekli kod.

$('.sayac').text(sayac); //Sayac div'ine sayaçtaki sayıyı yazması için gerekli kod

}else if(sayac == 5){

$('body').css({background: '#2196f3'}); // arkaplan değişmesi için gerekli kod.

$('.sayac').text(sayac); //Sayac div'ine sayaçtaki sayıyı yazması için gerekli kod

}else if(sayac == 4){

$('body').css({background: '#009688'}); // arkaplan değişmesi için gerekli kod.

$('.sayac').text(sayac); //Sayac div'ine sayaçtaki sayıyı yazması için gerekli kod

}else if(sayac == 3){

$('body').css({background: '#4caf50'}); // arkaplan değişmesi için gerekli kod.

$('.sayac').text(sayac); //Sayac div'ine sayaçtaki sayıyı yazması için gerekli kod

} else if(sayac == 2){

$('body').css({background: '#cddc39'}); // arkaplan değişmesi için gerekli kod.

$('.sayac').text(sayac); //Sayac div'ine sayaçtaki sayıyı yazması için gerekli kod

}else if(sayac == 1){

$('body').css({background: '#ffc107'}); // arkaplan değişmesi için gerekli kod.

$('.sayac').text(sayac); //Sayac div'ine sayaçtaki sayıyı yazması için gerekli kod

}else if(sayac == 0){

$('body').css({background: '#ff9800'}); // arkaplan değişmesi için gerekli kod.

$('.sayac').text(sayac); //Sayac div'ine sayaçtaki sayıyı yazması için gerekli kod

}

}, 1000);/// Burdaki 1000 sayısı 1 saniyeyi ifade eder. İnternette biraz araştırma yaparsanız bu 1000 sayısının mantığını kavrarsınız.



});

</script>