Skip to main content

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>


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.
Labels:

Comments

Post a Comment

Popular posts from this blog

Cara Membuat ReverseIP Dengan PHP

Kali ini, saya akan memberikan Script  ReverseIP Dengan PHP. Sihlakan Kalian copykan Script PHP Berikut ini. <?php if(isset($_POST['chek'])){ $ip = $ip = gethostbyname($_POST['domain']); echo '<font>Website:</font><br>'; echo $_POST['domain']; echo '<br>'; echo '<font>Ip Domain:</font><br>'; echo '<font color="green">'.$ip.'</font>'; } echo '<form method="post"> <input type="text" name="domain" size="40"> <input type="submit" name="chek" value="Check"> </fomr>'; ?> Save file dengan extensi *php, kemudian jalankan di localhost kalian masing-masing. Demo Sekian dulu yah, semoga bermanfaat buat kita semua
Post a Comment
Baca Lebih Lanjut »

Cara Membuat Text Mengetik Sendiri Dengan JavaScript

Hai sobat codes, kali ini mimin bakal share sebuah tutorial bagaimana Cara Membuat Text Seakan Mengetik sendiri dengan Menggunakan JavaScript. Buatlah Sebuah File Baru dengan extensi HTML. Contoh : mengetik.html Kemudian Untuk Langkah-Langkah nya Sihlakan Ikuti Sesuai langkah-langkah Berikut ini, Perhatikan dengan baik-baik! Langkah Pertama Copy Script HTML dibawah Ini, pastekan Ke file baru yang telah sobat Buat. <!DOCTYPE html> <html> <head> <title>Text Sedang Mengetik...</title> </head> <body> </body> </html> Baca Juga:  Cara Membuat Text Berkedip Dengan JavaScript Langkah Kedua Kemudian, copykan kode JavaScript berikut ini. <script type="text/javascript"> TypingText = function(element, interval, cursor, finishedCallback) {   if((typeof document.getElementById == "undefined") || (typeof element.innerHTML == "undefined")) {     this.running = true;     return;   }   this....
Post a Comment
Baca Lebih Lanjut »

Cara Membuat TEXT ASCII Di Termux

TEXT ASCII kali ini saya bakal share tutorial bagaimana cara membuat sebuah TEXT ASCII dengan Mudah menggunakan aplikasi Termux. Langsung saja Kita mulai tutorialnya.
Post a Comment
Baca Lebih Lanjut »