How to create a dynamic digital clock for your website using javascript

How to create a dynamic digital clock for your website using javascript

Dynamic Digital Clock

How to create a dynamic digital clock for your website using javascript
Time :
Day :

Click to see the clock


Just copy and past on your website
Source : 

<!DOCTYPE html>
<html>
<head>
<script>
function startTime() {
    var today = new Date();
    var h = today.getHours();
    var m = today.getMinutes();
    var s = today.getSeconds();
    m = checkTime(m);
    s = checkTime(s);
    document.getElementById(‘clock’).innerHTML =
    h + “:” + m + “:” + s;
    var t = setTimeout(startTime, 500);



var today = new Date();
    var day = today.getDate();
    var month = today.getMonth();
    var year = today.getFullYear();
 
    document.getElementById(‘day’).innerHTML =
    day + “/” + month + “/” + year;
    var d = setTimeout(startTime, 500);
}
function checkTime(i) {
    if (i < 10) {i = “0” + i};  // add zero in front of numbers < 10
    return i;
}

function checkTime(i) {
    if (i < 10) {i = “0” + i};  // add zero in front of numbers < 10
    return i;
}
</script>
<style>
.deco
{
text-align:center;
font-family:arial;
font-size:50px;
}
</style>
</head>
<body onload=”startTime()”>
<div class=”deco”>Time : <strong id=”clock”></strong></div>
<div class=”deco”>Day : <strong id=”day”></strong></div>
</body>
</html>



Output :

Comments

No comments yet. Why don’t you start the discussion?

Leave a Reply

Your email address will not be published. Required fields are marked *