Cara Membuat JAM DIGITAL JavaScript & HTML

Hallo Sobat codes, kali ini mimin bakal share tutorial bagaimana sih cara membuat JAM DIGITAL Menggunakan JavaScript & HTML. Nah kebetulan Mimin kali ini bakal ngasih tau Bagaimana Cara Membuatnya .Ok langsung saja kita mulai tutorialnya kali ini .

Langkah pertama, Buat Sebuah File Dengan Nama waktu.html


<html>

<head>

<title>Jam DIGITAL</title>



</head>

<body>



</body>

</html>

Langkah kedua , Kita menambahkan sebuah Kode CSS Nya Dulu .


<style type="text/css">

body{

background:#fff;

}

.jefri{

color:#666;

background:#eee;

text-align:center;

border:1px solid red;

}

</style>

Daftar Isi

→Tutorial Membuat Menu DropDown HTML
→Cara Membuat Button Image HTML
→Cara menambahkan Music Di Script Deface

Letakkan Kode CSS Nya Dibawah </title> atau tepat diatas kode </head>.
Langkah ketiga , menambahkan kode javascript nya ,Kegunaannya Adalah Menampilkan waktu,tanggal ,hari ,bulan, dan tahunnya di kode javascript tersebut .
Langsung saja Copykan Kode Dibawah ini. Lalu pastekan dibawah kode <body>.


<table class="jefri" width="50%" align="center" border="0">

<tr><td>

 <div id="clock">Waktu Akan Muncul Disini</div>

  <script type="text/javascript">

  function showTime() {

      var a_p = "";

      var today = new Date();

      var curr_hour = today.getHours();

      var curr_minute = today.getMinutes();

      var curr_second = today.getSeconds();

      if (curr_hour < 12) {

          a_p = "AM";

      } else {

          a_p = "PM";

      }

      if (curr_hour == 0) {

          curr_hour = 12;

      }

      if (curr_hour > 12) {

          curr_hour = curr_hour - 12;

      }

      curr_hour = checkTime(curr_hour);

      curr_minute = checkTime(curr_minute);

      curr_second = checkTime(curr_second);

   document.getElementById('clock').innerHTML=curr_hour + ":" + curr_minute + ":" + curr_second + " " + a_p;

      }



  function checkTime(i) {

      if (i < 10) {

          i = "0" + i;

      }

      return i;

  }

  setInterval(showTime, 500);

  </script>

  </td></tr>

Kode Diatas ini kegunaan nya adalah untuk menampilkan Waktu nya .

Langkah ke-empat , kemudian Kita tambahkan Lagi kode javascript dibawah ini .


  <tr><td>

  <script type='text/javascript'>

   var months = ['Januari', 'Februari', 'Maret', 'April', 'Mei', 'Juni', 'Juli', 'Agustus', 'September', 'Oktober', 'November', 'Desember'];

   var myDays = ['Minggu', 'Senin', 'Selasa', 'Rabu', 'Kamis', 'Jum&#39;at', 'Sabtu'];

   var date = new Date();

   var day = date.getDate();

   var month = date.getMonth();

   var thisDay = date.getDay(),

       thisDay = myDays[thisDay];

   var yy = date.getYear();

   var year = (yy < 1000) ? yy + 1900 : yy;

   document.write(thisDay + ', ' + day + ' ' + months[month] + ' ' + year);

  </script>

 </td></tr>

</table>

Letakkan kode diatas ini dibawah kode </tr>.
Kemudian save File nya Lalu coba jalankan ke browser kalian masing-masing .dan Lihat hasilnya tampak seperti gambar dibawah ini.

Sekian dulu yah tutorial Kali ini, semoga bermanfaat bagi sobat codes sekalian.

Cara Membuat JAM DIGITAL JavaScript & HTML

EAGLEcodes on HTML On March 04, 2020 with No comments

Daftar Isi