Cara menggunakan jam digital css
Membuat Jam Analog dan Digital Dengan JavascriptMembuat Jam Analog dan Digital Dengan Javascript – Seperti yang sudah kita pelajari dan dijelaskan sebelumnya pada tutorial Javascript dasar di malasngoding.com. Show Bahwa javascript bisa kita gunakan untuk membuat halaman website menjadi lebih interaktif. contohnya seperti tutorial Membuat Jam Analog dan Digital Dengan Javascript ini. Kita bisa membuat jam digital dengan javascript. dan kita juga bisa membuat jam analog dengan javascript. dan caranya pun sangat mudah. karena kita hanya menggunakan syntax dan fungsi-fungsi dasar yang sudah kita pelajari bersama-sama pada tutorial dasar javascript. BACA JUGA : Tutorial javascript dasar untuk pemula Langsung saja kita masuk ke bagian materi. silahkan teman-teman perhatikan dan ikuti secara teliti dan seksama. Membuat Jam Analog dan Digital Dengan JavascriptSaya asumsikan kepada teman-teman untuk membaca terlebih dulu tutorial-tutorial javascript dasar di www.malasngoding.com. agar lebih mudah memahami syntax atau coding jam dengan javascript yang sebentar lagi akan kita buat. membuat jam analog dan digital dengan javascript Di tutorial ini kita akan belajar membuat jam digital dengan javascript. dan belajar membuat jam analog sederhana dengan javascript. dimana nantinya jam yang kita buat ini bisa teman-teman terapkan codingnya ke blog atau website teman-teman sebagai widget jam. Kita mulai dengan belajar membuat jam digital. Membuat Jam Digital Dengan JavascriptUntuk cara membuat jam digital dengan javascript silahkan teman-teman ketik coding berikut. dan menyimpannya di dalam file HTML atau PHP. di sini saya menyimpannya dalam file dengan nama jam_digital.html jam_digital.html
Dan jika di jalankan maka hasilnya akan seperti berikut.  membuat jam digital dengan javascript Seperti yang terlihat pada gambar jam digital di atas. jam, menit, detiknya pun muncul dengan real time. Sesuai dengan jam pada saat ini, yaitu jam 15:17 WIB. Penjelasan Jam Digital JavascriptPerhatikan pada syntax di atas tadi. kita membuat beberapa element HTML yang kita beri penamaan class dan id masing-masing.
ada 3 element penting di sana, yang kita beri id jam, id menit, dan id detik. pada masing-masing id tersebut akan kita tampilkan sesuai dengan nama id nya masing-masing dengan javascript. misalnya pada id jam kita tampilkan jam sekarang, pada id menit kita tampilkan menit sekarang, dan pada id detik kita tampikan detik yang berjalan sekarang secara real-time. perhatikan pada bagian javascript.
di sini kita memerintahkan menjalankan function waktu() saat 1 detik pertama halaman ini di jalankan. dan perhatikan pada function waktu(). di sana kita membuat sebuah variabel dengan nama “waktu”. dan menimpan data waktu atau tanggal sekarang. kemudian menjalankan lagi function waktu() setelah 1 detik. ini untuk membuat perintah agar fungsi ini di jalankan setiap detik. sesuai dengan jam digital yang menampikan perubahan detiknya setiap 1 detik sekali. dan terakhir, data waktu atau tanggal yang terlah tersimpan dalam variabel waktu tadi kita pecah-pecah isinya dengan cara menampilkan jam ( waktu.getHours() ) pada id jam. menampilkan menit ( waktu.getMinutes() ) pada id menit. serta menampilkan detik (waktu.getSeconds() ) pada id detik.
Oke selesai, diharapakan teman-teman bisa mudah memahami penjelasan ini. jika teman-teman masih kurang mengerti, silahkan untuk meninggalkan komentar di akhir tutorial ini. insyallah jika ada kemudahan waktu akan saya balas. Selanjutnya kita akan belajar membuat jam analog sederhana tapi keren dengan javascript. Membuat Jam Analog Dengan JavascriptKita lanjutkan dengan belajar membuat jam analog dengan javascript. Perhatikan syntax berikut.
|
