Cara Membuat Jam Digital Di Halaman Website

Top of Form


Belajar Javascrpt - Kali ini saya akan membagikan tutorial bagaimana cara membuat jam digital di halaman website dengan javascript. Buka kode editor anda saya menggunakan Adobe DreamWeaver.

Buat tag html seperti dibawah ini
<html>
<head>



<head>
<body>

</body>
</html>

Setelah itu kopikan kode javascript dibawah ini setelag tag 

<body>:
<link type="text/css" rel="stylesheet" href="style.css" /><center>
<h2>Jam Digital by Arif AmStyle</h2>
<div id="clockDisplay" class="clockStyle">

</div>

<script type="text/javascript" language="javascript">
function renderTime(){
 var currentTime = new Date();
 var h = currentTime.getHours();
 var m = currentTime.getMinutes();
 var s = currentTime.getSeconds();
 if (h == 0){
  h = 24;
   }
   if (h < 10){
    h = "0" + h;
    }
    if (m < 10){
    m = "0" + m;
    }
    if (s < 10){
    s = "0" + s;
    }
 var myClock = document.getElementById('clockDisplay');
 myClock.textContent = h + ":" + m + ":" + s + "";   
 setTimeout ('renderTime()',1000);
 }
 renderTime();
</script>


Untuk Mempercantik tampilan, sisipkan css dibawah ini

@charset "utf-8";
/* CSS Document */
.clockStyle{
background-color:#000;
border:#999 2px inset;
padding:6px;
color:#0FF;
font-family:"arial black";
font-size:16px
font-weight:bold;
letter-spacing:2px;
display:inline;
}



EmoticonEmoticon

loading...
loading...