Cara Membuat Jam Digital Dengan Javascript - Hallo sahabat Dev-Create, Pada Artikel yang anda baca kali ini dengan judul Cara Membuat Jam Digital Dengan Javascript, kami telah mempersiapkan artikel ini dengan baik untuk anda baca dan ambil informasi didalamnya. mudah-mudahan isi postingan Artikel javascript, yang kami tulis ini dapat anda pahami. baiklah, selamat membaca. Show Judul : Cara Membuat Jam Digital Dengan Javascript Cara Membuat Jam Digital Dengan JavascriptKali ini saya akan share tutorial cara membuat jam digital dengan detik terus berjalan seperti aslinya dengan javascript, pertama buatlah projek dengan nama terserah anda kemudian salin kode berikut dan simpan dengan nama index.php atau .html <!DOCTYPE html> <html> <head> <title>MEMBUAT JAM DIGITAL SENDIRI</title> <script type="text/javascript"> window.onload = function() { jam(); } function jam() { var e = document.getElementById('jam'), d = new Date(), h, m, s; h = d.getHours(); m = set(d.getMinutes()); s = set(d.getSeconds()); e.innerHTML = h +':'+ m +':'+ s; setTimeout('jam()', 1000); } function set(e) { e = e < 10 ? '0'+ e : e; return e; } </script> </head> <body> <center> <h2 style="font-size: 120px; font-family: verdana;" id="jam"></h2> </center> </body> </html> setelah itu jalankan projek anda di browser, dan taraaa.. detik dari jam berdetak Demikianlah Artikel Cara Membuat Jam Digital Dengan JavascriptSekianlah artikel Cara Membuat Jam Digital Dengan Javascript kali ini, mudah-mudahan bisa memberi manfaat untuk anda semua. baiklah, sampai jumpa di postingan artikel lainnya. Anda sekarang membaca artikel Cara Membuat Jam Digital Dengan Javascript dengan alamat link https://dev-create.blogspot.com/2019/07/cara-membuat-jam-digital-dengan.html
Kali ini kita
akan belajar program sederhana yaitu jam digital yang waktu awalnya diambil dari server sehingga tidak terpengaruh oleh jam yang ada di client. Ok deh langsung saja ke codingnya: <script type="text/javascript"> var detik = <?php echo date('s'); ?>; var menit = <?php echo date('i'); ?>; var jam = <?php echo date('H'); ?>; function clock() { if (detik!=0 && detik%60==0) { menit++; detik=0; } second = detik; if (menit!=0 && menit%60==0) { jam++; menit=0; } minute = menit; if (jam!=0 && jam%24==0) { jam=0; } hour = jam; if (detik<10){ second='0'+detik; } if (menit<10){ minute='0'+menit; } if (jam<10){ hour='0'+jam; } waktu = hour+':'+minute+':'+second; document.getElementById("clock").innerHTML = waktu; detik++; } setInterval(clock,1000); </script> <div style="text-align:center;"> <h3>WAKTU SAAT INI :</h3> <h2 id="clock"></h2> </div> mudah sekali kan sobat cara bikinnya, sekarang kita sudah tau cara membuat jam dengan javascript. Saya tunggu kritik dan sarannya. Salam Blogger Madura Description AplikasiCode Candil Kuya - Halo Pengunjung Code Candil Kuya, Hari ini di Blog ini, Saya akan membuat jam digital javascript menggunakan HTML, CSS, dan Javascript. Di blog ini, saya telah membagikan proyek tentang Contoh animasi CSS, Javascript, Webdesign, dll. Pastikan untuk memeriksanya jika Anda mau. Sekarang dalam artikel ini, kita akan membuat jam digital dalam format 24 jam dan akan ditampilkan dengan cara HH:MM:SS. Mari kita mulai dengan bagian HTML dari proyek. Pertama, kita akan mengambil tag ap dengan id 'jam'. Saya akan menggunakan tag p untuk memasukkan waktu menggunakan kode javascript khusus. Mari kita mulai dengan bagian CSS dari proyek. Teks diberi ukuran font dan warna gradien. Keluarga fontnya dipilih sebagai Montserrat. Untuk membuat teks lebih tebal, saya memberikan font-weight 500. Saya menggunakan warna hitam sebagai latar belakang snippet. Anda dapat menggunakan warna apa pun pilihan Anda. Saya telah menghilangkan lebar dan tinggi default proyek dengan menetapkan margin dan padding ke nol. Untuk membuat 'jam' sejajar sempurna di tengah, saya menggunakan properti grid display. Setelah itu, saya telah mengatur 'place-items: center' dan ketinggian ke 100vh. Dengan cara ini, jam akan secara otomatis sejajar dengan pusat viewport. Di bagian javascript, pertama, kita telah mengambil fungsi customClock(). Dalam proyek ini, Saya mencoba untuk mencapai jam, menit, dan detik saat ini yang disimpan dalam variabel yang berbeda. Digit jam akan ditampilkan dalam satu digit jika jumlahnya kurang dari 10. Untuk instan, jika menit nomor 6, itu akan ditampilkan sebagai 6 bukan 06. Setelah fungsi 'customClock' siap, Saya akan menampilkan waktu di dalam tag p yang kita buat sebelumnya. Kita dapat melakukannya dengan mendapatkan id 'jam' menggunakan metode document.getElementById dan memberikan waktu kita sebagai konten div menggunakan properti innerHTML. Jam Digital Javascript [ Source Code ]:Tutorial Membuat Jam Digital JavascriptUntuk membuat Jam Digital Javascript ini, buat dua file. Salah satunya adalah HTML dan, yang lainnya adalah CSS. Anda dapat membuat file js terpisah untuk meletakkan kode js. Untuk proyek ini, saya telah memasukkan kode js sebelum tag HTML penutup. Pada akhirnya, Silakan salin kode di bawah ini dan tempelkan ke file Anda.
PenutupNote : Cukup Sekian Tutorial Cara Membuat Jam Digital Menggunakan Javascript Semoga Informasi Yang dibagikan bisa bermanfaat, jangan lupa di share kepada teman yang membutuhkan, Terima Kasih Sudah Berkunjung. Incoming search terms :
|