Cara Membuat Countdown Timer 2016 Di Blog

Cara Membuat Countdown Timer 2016 Di Blog

Cara Membuat Countdown Timer 2016 Di Blog - kali ini saya akan membahas tentang cara untuk membuat countdown timer atau hitungan mundur pada blog untuk tahun 2016 ini, sungguh tidak terasa sekali bukan, sepertinya saya baru minggu kemarin bikin blog :o, pas di cek ternyata ane bikin nih blog emang baru 7 desember kemarin hihi, biasanya countdown di gunakan untuk waktu waktu tertentu atau bisa disebut waktu waktu spesial :D, khususnya pada tahun baru :D

Oke, kita akan membuat countdown untuk tahun 2016 sekarang :D, untuk lihat demo sobat bisa melihatnya di bawah ini :


Cara Mudah Membuat Countdown Timer 2016

1. Seperti biasa sobat login dulu ke blog sobat
2. Lalu masuk ke Tata Letak > Tambah Gadget > HTML / Javascript
3. Setelah itu masukan kode berikut di dalam kotak yang tadi
<style type="text/css" scoped="scoped">

#tahunbaru2016 {background:black;color:#5CAAFF;font-family:Oswald, Arial, Sans-serif;font-size:20px;text-transform:uppercase;text-align:center;padding:10px 0;font-weight:normal;}

  .teks {color:white}

</style>

<div id="tahunbaru2016">

<span id="countdown"></span>

</div>

<script type='text/javascript'>

//<![CDATA[

// set the date we're counting down to

var target_date = new Date("Jan 1, 2016").getTime();

// variables for time units

var days, hours, minutes, seconds;

// get tag element

var countdown = document.getElementById("countdown");

// update the tag with id "countdown" every 1 second

setInterval(function () {

    // find the amount of "seconds" between now and target

    var current_date = new Date().getTime();

    var seconds_left = (target_date - current_date) / 1000;

    // do some time calculations

    days = parseInt(seconds_left / 86400);

    seconds_left = seconds_left % 86400;



    hours = parseInt(seconds_left / 3600);

    seconds_left = seconds_left % 3600;



    minutes = parseInt(seconds_left / 60);

    seconds = parseInt(seconds_left % 60);



    // format countdown string + set tag value

  countdown.innerHTML = days + " <span class=\'teks\'>hari</span> " + hours + " <span class=\'teks\'>jam</span> "

  + minutes + " <span class=\'teks\'>menit</span> " + seconds + " <span class=\'teks\'>detik menuju Tahun</span> 2016";



}, 1000);

//]]>

</script>

4. Silahkan sobat save dan lihat hasilnya 8-)

Sekian tutorial Cara Membuat Countdown Timer 2016 Di Blog, baca juga cara membuat timestamp blog menjadi seperti facebook.
Bagi sobat yang bingung sobat bisa bertanya di kotak komentar, tidak usah sungkan untuk bertanya :D

Share this

Selanjutnya
Newer Post
Sebelumnya
Older Post
0 Komentar

Penulisan markup di komentar
  • <i rel="quote"> quote anda </i>
  • <i rel="code"> kode </i>
  • <i rel="pre"> kode panjang </i>
  • <i rel="image"> URL gambar </i>
  • [iframe] URL embed video [/iframe]
  • Kemudian parse kode tersebut pada kotak di bawah ini
  • Gunakan emoticon agar terlihat lebih cantik