Countdown Timer Keren Dengan Ajax jQuery

Countdown Timer Keren Dengan Ajax jQuery - Buat hari-hari penting kalian semakin seru dengan menarsiskan fitur penghitungan mundur momentum terindah dan terbaik kalian di halaman blog masing-masing. 

 

Simak langkah mudahnya di bawah ini :

1. Edit dan Manipulasi Script jQuery-nya :

var target_date = new Date("Aug 22, 2014").getTime();

var days, hours, minutes, seconds;

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

setInterval(function () {

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

    var seconds_left = (target_date - current_date) / 1000;

    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);

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

  + minutes + " <span class=\'putih\'>menit</span> " + seconds + " <span class=\'putih\'>detik menuju</span> 2210"; 

}, 1000);

Note :

• Baris pertama, tentukan tanggal akhir yang akan kalian jadikan countdownya. di atas adalah tanggal lahir saya. 22 Agustus. Kalian bisa menggantinya sesuka hati.
• Pada teks detik menuju bisa kalian ganti dengan kata-kata lain.

2. Copas saja script pada point 1 ke text editor kalian, bisa menggunakan Notepad atau Notepad++.

3. Jika sudah kalian manipulasi scriptnya, silahkan simpan file dengan format .js. Contoh : timersmz.js.

4. Upload file JavaScript tersebut ke Google Drive atau ke yourjavascript.com.

5. Jika sudah mendapatkan url filenya, silahkan copas saja script di bawah ini pada Widget blog kalian masing-masing.

<style type="text/css" scoped>

#tahunbaru {

    background:#739bc8;

    color:yellow;

    font-size:150%;

    text-transform:uppercase;

    text-align:center;

    padding:20px 0;

    font-weight:normal;

    border-radius:5px;

    line-height:1.8em;

}

.putih {color:white}

</style>

<div id='tahunbaru'>

    <span id='countdown'></span>

</div>

<script type="text/javascript" src="URL Javascript"></script>

6. Simpan.

Nah, bagiamana. Sangat mudah kan. Asalkan kalian cermat dalam mengikuti tutorial cara membuat countdown dengan jQuery di Blogger ini pasti kalian bisa pasang. Dengan memasang fitur countdown di blogger dengan efek jQuery ini, buat momentum terbaikmu agar selalu dinanti-nantikan banyak orang dengan notife perhitungan mundur.

http://www.nemukabar.com/2014/01/cara-membuat-countdown-dengan-efek.html

Tweet