Basit Geri Sayımlı Buton Yapma

Aksu · 8 Nisan 2021

Bu konumuzda geri sayım yapan ve bu geri sayım sonucunda bize metin veyahut yönlendirme botunu yapabileceğimiz 2 farklı kod bloğu paylaşacağım.

1. Kodumuz Hk.;
Bu kodumuz da sitemize geri sayım yapacak kod ekliyoruz ve bu geri sayımın sonunda bize istediğimiz metin, sayı veya istediğimizi göstereceğimiz kod olacaktır.

Bu kodumuzu sitemizin hangi sayfasında veyahut neresinde kullanmak istersek oraya yapıştırıyoruz ve şu kısımlar düzenliyoruz;
Buton içeriği kaç saniye sonrasında açılsın

var saniye=3;

Geri Sayım bittikten sonra ne gösterilsin

document.getElementById('uyari').innerHTML="test";

JavaScript:

<script type="text/javascript">
var deger;
var saniye=3;

function saniyeDurdur()
  {
    window.clearTimeout(deger);
    document.getElementById('uyari').innerHTML="Geri sayımı durdurdunuz!";
  }

function saniyeBaslat()
{
    document.getElementById('uyari').innerHTML="";
    if(saniye >0){
    saniye --;
    document.getElementById('saniye').innerHTML=saniye;
    deger=window.setTimeout('saniyeBaslat()',1000);   
    }else{
    window.clearTimeout(deger);
    document.getElementById('uyari').innerHTML="test";
    }
}
</script>

<input type="button" onclick="saniyeBaslat()" value="Başlat" />
<div id="saniye"></div>
<div id="uyari"></div>

2.Kodumuz Hk.;
Bu kodumuz da sitemize geri sayım yapacak kod ekliyoruz ve bu geri sayımın sonunda botun ile yönlendirme yapacağımız kod olacaktır.

Bu kodumuzu sitemizin hangi sayfasında veyahut neresinde kullanmak istersek oraya yapıştırıyoruz ve şu kısımlar düzenliyoruz;
Buton içeriği kaç saniye sonrasında açılsın

var deger,saniye=3;

Geri sayım bittikten sonra butonumuzda ne isim yazacak

document.getElementById('trigger').value = "DEVAM ET";

Geri Sayım bittikten sonra gösterecek buton nereye yönlendirecek

document.getElementById('trigger').setAttribute('onclick', 'window.open("
Linkleri görebilmek için giriş yap veya kayıt ol.
");');

JavaScript:

<script type="text/javascript">
var deger,saniye=3;

function saniyeBaslat() {
    document.getElementById('uyari').innerHTML="";
    if(saniye == 3)
        deger=setInterval('saniyeBaslat()', 1000);
    document.getElementById('saniye').innerHTML=saniye;
    saniye--;

    if(saniye < 0){
        clearInterval(deger);
        document.getElementById('saniye').remove();
        document.getElementById('trigger').setAttribute('style', 'height:36px;font-size:16px;font-weight:bold;');
        document.getElementById('trigger').setAttribute('onclick', 'window.open("MMO Tutkunları");');
        document.getElementById('trigger').value = "DEVAM ET";
    }
}
</script>

<input type="button" id="trigger" onclick="saniyeBaslat()" value="Başlat" />
<div id="saniye"></div>
<div id="uyari"></div>

Ara

Basit Geri Sayımlı Buton Yapma

Aksu

Ban İşleri Yüksek Kurulu Başkanı

Benzer konular