MEMBUAT JAM DIGITAL DENGAN JQUERY
MEMBUAT JAM DIGITAL DENGAN JQUERY
Marbelweb – Assalamu’alaikum, Sahabat marbelweb kali ini saya akan sharing bagaimana
cara membuat Jam Digital dengan JQuery. Banyak sekali mungkin tutorial yang sudah ada
mengenai cara membuat Jam, tapi saya coba juga barang kali masih bisa bermanfaat buat
Sobat semua yang membaca Blog ini.
Membuat Jam Digital memang banyak caranya, kita bisa menggunakan Javascript, Ajax,
PHP, JQuery dengan Plugin JqClocknya dan juga bisa dengan JQuery saja. Baiklah kali ini
saya akan memberikan cara “Bagaimana membuat Jam Digital dengan JQuery” JQuery saja
tentunya, untuk membuat jam dengan Plugin JqClock akan diberikan di waktu yang lain.
Ok Bro...!!!
Begininih caranye :
1. Kita diwajibkan membuat dulu nih skrip PHP yang berfungsi untuk mengambil waktu
dari server ( komputer system yang kita pakai )
2. Yang kedua ini nih yang agak penting untuk bisa melanjutkan ke langkah berikutnya,
apa itu? Tentunya Harus Tahu Bagaimana Menggunakan JQuery! Sobat sudah tahu
semua kan? Sip ah, kita lanjut saja ok. Bagi yang belum tahu Gimana Gan!!! He..he..
Coba cari di mbah google aje ye!
Ini Skrip pertama yang kita butuhkan
jam.php
Sampai disini coba deh dijalankan di browser, apa yang akan tampil? Muncul tampilan
jam saat ini dari kommputer anda kan ???? kalo tempat gue nih munculnya “Hantu...”
e...e...e... keluarnya seperti ini :
Nge-print itu Terlihat lebih Indah daripada CoPas
Page 1 of 3
MEMBUAT JAM DIGITAL DENGAN JQUERY
Pada tampilan diatas DETIK yang ditampilkan adalah terlihat STATIS, untuk bisa
mendapatkan detik-detik berikutnya adalah dengan cara merefresh/reload pada browser.
Untuk mengatasi hal itu coba sobat membuat 1 (satu) skrip lagi dengan JQuery, skrip ini
akan membuat jam yang kita buat nantinya menjadi dinamis, detik-detiknya bisa berjalan
terus/berdetak secara terus menerus, tanpa kita reload/refresh.
Berikut nih skripnya
jam_jquery.php
$(document).ready(function() {
setInterval (function() {
$('#divjam').load('jam.php?acak='+Math.random());
},1000); //akan mengerjakan refresh tiap 1 detik
});
.:Membuat Jam dengan JQuery:.
Sekarang Coba Sobat jalankan skrip diatas di browser anda, muncul apa???
Nge-print itu Terlihat lebih Indah daripada CoPas
Page 2 of 3
MEMBUAT JAM DIGITAL DENGAN JQUERY
Sepintas keliatan sama dengan diatas, Perbedaanya terlihat Jelas di Komputer Anda.
He...he... udah tahu kan bedanya???? Kalo belum berarti belum berhasil, coba perhatikan
dan amati skripnya barang kali ada yang keliru. Perbedaanya adalah terletak pada detik
yang ditampilkan oleh skrip jam.php terlihat statis, sedangkan detik yang ditampilkan skrip
jam_jquery.php adalah detiknya berjalan secara terus menerus.
Semoga Bermanfaat, Selamat Mencoba!!!
e-mail : sushardianto@gmail.com
Wassalamu’alaikum Wr. Wb
Brebes,...................................
Penulis,
Sus Hardianto
Nge-print itu Terlihat lebih Indah daripada CoPas
Page 3 of 3
Marbelweb – Assalamu’alaikum, Sahabat marbelweb kali ini saya akan sharing bagaimana
cara membuat Jam Digital dengan JQuery. Banyak sekali mungkin tutorial yang sudah ada
mengenai cara membuat Jam, tapi saya coba juga barang kali masih bisa bermanfaat buat
Sobat semua yang membaca Blog ini.
Membuat Jam Digital memang banyak caranya, kita bisa menggunakan Javascript, Ajax,
PHP, JQuery dengan Plugin JqClocknya dan juga bisa dengan JQuery saja. Baiklah kali ini
saya akan memberikan cara “Bagaimana membuat Jam Digital dengan JQuery” JQuery saja
tentunya, untuk membuat jam dengan Plugin JqClock akan diberikan di waktu yang lain.
Ok Bro...!!!
Begininih caranye :
1. Kita diwajibkan membuat dulu nih skrip PHP yang berfungsi untuk mengambil waktu
dari server ( komputer system yang kita pakai )
2. Yang kedua ini nih yang agak penting untuk bisa melanjutkan ke langkah berikutnya,
apa itu? Tentunya Harus Tahu Bagaimana Menggunakan JQuery! Sobat sudah tahu
semua kan? Sip ah, kita lanjut saja ok. Bagi yang belum tahu Gimana Gan!!! He..he..
Coba cari di mbah google aje ye!
Ini Skrip pertama yang kita butuhkan
jam.php
Sampai disini coba deh dijalankan di browser, apa yang akan tampil? Muncul tampilan
jam saat ini dari kommputer anda kan ???? kalo tempat gue nih munculnya “Hantu...”
e...e...e... keluarnya seperti ini :
Nge-print itu Terlihat lebih Indah daripada CoPas
Page 1 of 3
MEMBUAT JAM DIGITAL DENGAN JQUERY
Pada tampilan diatas DETIK yang ditampilkan adalah terlihat STATIS, untuk bisa
mendapatkan detik-detik berikutnya adalah dengan cara merefresh/reload pada browser.
Untuk mengatasi hal itu coba sobat membuat 1 (satu) skrip lagi dengan JQuery, skrip ini
akan membuat jam yang kita buat nantinya menjadi dinamis, detik-detiknya bisa berjalan
terus/berdetak secara terus menerus, tanpa kita reload/refresh.
Berikut nih skripnya
jam_jquery.php
$(document).ready(function() {
setInterval (function() {
$('#divjam').load('jam.php?acak='+Math.random());
},1000); //akan mengerjakan refresh tiap 1 detik
});
.:Membuat Jam dengan JQuery:.
Sekarang Coba Sobat jalankan skrip diatas di browser anda, muncul apa???
Nge-print itu Terlihat lebih Indah daripada CoPas
Page 2 of 3
MEMBUAT JAM DIGITAL DENGAN JQUERY
Sepintas keliatan sama dengan diatas, Perbedaanya terlihat Jelas di Komputer Anda.
He...he... udah tahu kan bedanya???? Kalo belum berarti belum berhasil, coba perhatikan
dan amati skripnya barang kali ada yang keliru. Perbedaanya adalah terletak pada detik
yang ditampilkan oleh skrip jam.php terlihat statis, sedangkan detik yang ditampilkan skrip
jam_jquery.php adalah detiknya berjalan secara terus menerus.
Semoga Bermanfaat, Selamat Mencoba!!!
e-mail : sushardianto@gmail.com
Wassalamu’alaikum Wr. Wb
Brebes,...................................
Penulis,
Sus Hardianto
Nge-print itu Terlihat lebih Indah daripada CoPas
Page 3 of 3