Kamis, 25 Desember 2014

Widget Jam Hitung Mundur/Countdown 2015 di Blog



Tak terasa tahun 2014 sudah mau meninggalkan kita, banyak peristiwa yang datang tanpa kita mengiranya sebelumnya baik itu suka maupun duka. Memang, moment moment di tahun 2014 harus kita ingat dan pada tahun baru 2015 kita harus mengubah diri untuk lebih baik lagi :). Resolusi saya di tahun 2015 adalah LULUS UN dengan nilai yang memuaskan (diatas 8,0 lah yaa :3)  #ah kebanyakan ngoceh haha :v . Cekidot 



Tutorial step by step :

1. Copy kan kode berikut ini di HTML/Javascript sobat (Blogger → tata letak → tambah gadget → html/ javascript)

<style type="text/css" scoped="scoped">
#tahunbaru2015 {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="tahunbaru2015">
<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, 2015").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> 2015";

}, 1000);
//]]>
</script>
2. Setelah copy paste, klik simpan template. Kini telah terpasang jam hitung mundur tahun 2015 nya :D

Semoga bermanfaat ya sob :) 
Share:

5 komentar:

  1. Sep nih.. nice post.. dan 1 lagi ane mau tanya klo udh tahun 2015. widgetnya non aktif ato gmn? >> kunjungi blog ane y http://gerombolan-tips.blogspot.com/

    BalasHapus
    Balasan
    1. kayak nya gak aktif sob, soalnya kan countdown tahun 2015. pas tahun baru keknya ada surprise gitu dari widgetnya :D. menuju tkp :D

      Hapus
  2. Gan maaf nanya lagi, ternyata setelah ane mau pasang itu gk bisa.. waktu mau simpan itu keluar tulisan javascript:void(0) gitu gan.. solusinya gmn ya?

    BalasHapus
    Balasan
    1. udah diperhatiin kodenya sob? ada yg salah ga? dicoba lagii

      Hapus

Komentar disini mah gak banyak aturannya, setelah baca kasih komentar ya. Supaya gue lebih semangat lagi buat nulis! Hehe

-Muhammad Afif